超级鱼在页面加载上悬停

时间:2013-05-12 15:01:48

标签: javascript css hover superfish

嗨我正在使用jquery superfish,我需要在页面加载时激活(悬停)第一个菜单项,但是在悬停在第一个项目上的另一个菜单项取消时。有什么建议吗?

这是菜单的HTML代码

<ul class="sf-menu" >
        <li class="current">
            <a href="#"><img class="imgbottom1" src="images/domecky.jpg" alt="venkovní plochy">
            <div class="obaldomecky"><h4>venkovní plochy</h4></div></a>
            <ul class="first">
                <li>
                    <a href="#">120m2</a>
                </li>

            </ul>

        </li><li>
            <a href="#"><img class="imgbottom1" src="images/domecky.jpg" alt="venkovní plochy">
            <div class="obaldomecky"><h4>venkovní plochy</h4></div></a>
            <ul class="second">
                <li>
                    <a href="#">120m2</a>
                </li>

            </ul>

              

        <script>
   $('#test').hover(

   function(){ $(this).removeClass('sfHover')}

      )</script>

我的网站sis http://www.manko-design.cz/demo/我的工作方式不合适。我需要这个。当我将光标移动到该行脚本中的另一个图像时,从第一个图像中删除类。如果我将光标从图像移出图像而不是从图像中移出另一个图像,最后悬停图像保持悬停。

1 个答案:

答案 0 :(得分:0)

您可以通过将类li>ul附加到其上并强制其.currentopacity属性来使最后一个悬停的display元素始终可见:

使用Javascript:

$(document).ready(function(){
    $('ul.sf-menu').superfish();
    var last_hover = $('.sf-menu>li:first');
    $('ul.sf-menu>li').hover(function () {
        last_hover.removeClass('current');
        last_hover = $(this);
        last_hover.addClass('current');
    }, function(){
    });
});

CSS:

.current > ul {
    display:block !important;
    opacity:1 !important;
}

fiddle