0

我有这个 html 代码,我正在尝试使用 jquery 来激活弹出菜单,但没有任何成功。由于菜单是自动创建的,所以我无法修改 html 代码。周围的任何 jquery 大师都可以帮助解决这个问题吗?

先感谢您 :)

html代码:

<div class="menu horizontal menu-horizontal">
<ul class="root static">
<li class="static">
<a class="static menu-item" href="">
<span class="additional-background">
<span class="menu-item-text">HOME</span>
</span>
</a>
</li>
<li class="static dynamic-children">
<a class="static dynamic-children menu-item" href="">
<span class="additional-background">
<span class="menu-item-text">ABOUT</span>
</span>
</a>
<ul class="dynamic" style="">
<li class="dynamic">
<a class="dynamic menu-item" href="">
<span class="additional-background">
<span class="menu-item-text">WHO WE ARE</span>
</span>
</a>
</li>
<li class="dynamic">
<a class="dynamic menu-item" href="">
<span class="additional-background">
<span class="menu-item-text">OUR STRATEGY</span>
</span>
</a>
</li>
<li class="dynamic">
<a class="dynamic menu-item" href="">
<span class="additional-background">
<span class="menu-item-text">OUR CLIENTS</span>
</span>
</a>
</li>
</ul>
</li>
</div>

jQuery代码:

<script type="text/javascript">

        $('body').ready(function() {


            $('li.dynamic-children').hover(function() {

                $(this).find('ul.dynamic').slideToggle(); 
            });
        });
    </script>
<script type="text/javascript">
4

2 回答 2

0

Your code works fine, just use $(document).ready():

$(document).ready(function () {
    $('li.dynamic-children').on('hover',function () {
         $(this).find('ul.dynamic').slideToggle();
    });
});

JSFiddle

于 2013-04-19T16:51:55.303 回答
0

jquery 代码是正确的!我不得不稍微修改它以与 SharePoint 中的当前 CSS 兼容。最终代码(即使没有优化)是

<script type="text/javascript">

$(document).ready(function () {

         $('li.dynamic-children').find('ul.dynamic').css("display","none");

}); </script>

<script type="text/javascript">
$(document).ready(function () {
    $('li.dynamic-children').on('hover',function () {
     $(this).addClass("hover");
         $(this).find('ul.dynamic').slideToggle();
         $(this).find('ul.dynamic').css('left','-1px');
         $(this).find('ul.dynamic').css('top','43px');
    });
}); </script>
于 2013-04-23T06:14:29.783 回答