移至子菜单后使菜单保持悬停答案

【问题标题】：Make menu stays hovered after move away to submenu移至子菜单后使菜单保持悬停
【发布时间】：2014-03-29 04:19:46
【问题描述】：

我使用 css 和 js 代码制作了一个菜单，以便在悬停在菜单部分时显示图像和文本，但我还需要在悬停后让菜单的颜色保持不变。

这里是网站：http://www.cabas-durables.fr/magento/index.php/accueil.html

这里是css和js代码：

.product-block-botton {
    border-right:#ffffff solid 1px;
    text-align:center;
    vertical-align:middle;
    font-size:16px;
    padding:5px;
    height:30px;
    color:#ffffff;
}
.product-block-botton:hover {
    color:#000000;
}
.last-button {
    border:none;
}
.type1 {
    background-color:#B83E6C;
    cursor:pointer;
    width:25%;
}

HTML

<table class="product-block">
<tr>
    <td colspan="4" class="product-block-head">CHOISISSEZ VOTRE SAC
    </td>
</tr>
<tr>
    <td class="product-block-botton type1">Sac Papier Luxe</td>
    <td class="product-block-botton type1">Sac Poignées Torsadées</td>
    <td class="product-block-botton type1">Sac Poignées Plates</td>
    <td class="product-block-botton last-button type1">Sac Réutilisable</td>
</tr>
</table>

<script type="text/javascript">
    var $j = jQuery.noConflict();
    $j(document).ready(function(e) {
        $j('.product-block-botton').each(function(index, element) {
            $j(this).hover(function(){
                $j('.categories').hide();
                $j('.categories').eq(index).show();
            });
        });
    });
</script>

我希望我是清楚的，并提前感谢。

【问题讨论】：

悬停后需要保留颜色是什么意思？您希望初始链接保持白色吗？
您好 Romain，感谢您的回复，我的意思是我希望单元格在相关照片显示期间保持突出显示。所以访问者对类别毫无疑问
悬停可以定义两个函数 $(this).hover(function() {....}, function() {.....})
您好 Romain，请查看网站 cabas-durables.fr/magento/index.php/accueil.html，在幻灯片放映后查看菜单块
嗨，Atal，感谢您的回复，您的意思是我可以毫无问题地从函数中删除“.hover”吗？

标签： javascript jquery html css

【解决方案1】：

使用： $j(this).mouseenter(function(){ $j(this).addClass("悬停"); });

在 CSS 中：

.product-block-botton.hovered {
   color:#000000;
 }

【讨论】：

嗨 Rajiv007，感谢您编辑我的问题并感谢您的回复，但不幸的是，在使用“.hovered”后，它仍然没有在悬停后保持黑色
使用“mouseenter”而不是“hover”
我用过 .product-block-botton:mouseenter { color:#000000; }，然后它在悬停时根本没有改变颜色，我添加了这样的 js： $j(this).mouseenter(function(){ $j(this).addClass("hovered"); });
你知道这是为什么吗？
你必须做出一个小提琴来了解你需要什么