【问题标题】:Super fish hover on page load超级鱼在页面加载时悬停
【发布时间】:2013-05-13 20:52:23
【问题描述】:

您好,我正在使用 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>

我的网站在这里http://www.manko-design.cz/demo/ 它无法按我的需要工作。我需要这个。当我将光标移到该行脚本中的另一个图像上时,从第一个图像中删除类。如果我将光标从图像移到图像之外,但不在行中的另一个图像上,最后一个悬停图像保持悬停。

【问题讨论】:

    标签: javascript css hover superfish


    【解决方案1】:

    您可以通过将类.current 附加到它并强制其opacitydisplay 属性来使最后一个悬停的li&gt;ul 元素始终可见,如下所示:

    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

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2020-04-15
      • 1970-01-01
      • 1970-01-01
      • 2016-12-06
      • 1970-01-01
      相关资源
      最近更新 更多