[英]Jquery + select the first ul of a menu
I have read several posts of this problem but I don't find the solution. 我已经阅读了有关此问题的几篇文章,但找不到解决方案。
I have created a menu with 3 levels. 我创建了一个包含3个级别的菜单。 I want to display the second & the third levels with a hover on the first level.
我想在第二级和第三级显示鼠标悬停。 For this I use the code:
为此,我使用代码:
$("#header ul.menu li").hover(
function(){
$(this).find("ul").fadeTo('slow', 0.9);
},
function(){
$(this).find("ul").fadeOut('slow');
}
);
It's ok and the submenu appears with a hover on the first level. 没关系,并且子菜单在第一级上带有悬停出现。
But, if I make a hover the second and the third level some ul children of the first ul, disappears. 但是,如果我将鼠标悬停在第二层和第三层,则第一个ul的一些ul孩子会消失。
How can I select only the first ul in my function? 如何仅选择函数中的第一个ul? I have tried with several methods but without success :
我尝试了几种方法,但没有成功:
$("#header ul.menu > li").hover(...
or 要么
$(this).children("ul")....
Can you help me to resolve this problem? 您能帮我解决这个问题吗?
Thanks for your replies. 多谢您的回覆。
Have you tried using the :eq pseudo selector? 您是否尝试过使用:eq伪选择器? http://api.jquery.com/eq-selector/
http://api.jquery.com/eq-selector/
You can select any element using an index: 您可以使用索引选择任何元素:
$('a:eq(0)')
The above will return the first <a>
element on the page. 上面的代码将返回页面上的第一个
<a>
元素。
I have used the following method, it is working fine for me. 我使用了以下方法,对我来说很好用。
$("ul.menu > li").hover(
function(){
$(this).find("ul").fadeTo('slow', 0.9);
},
function(){
$(this).find("ul").fadeOut('slow');
}
);
I have found a solution, but it may not be clean. 我已经找到了解决方案,但可能并不干净。 With JQuery, I add a class on the first ul.menu (nav).
使用JQuery,我在第一个ul.menu(nav)上添加了一个类。 Then I write this code:
然后我写这段代码:
$(".menu-parent-wrapper > ul").addClass("nav");
$("#header ul.nav > li").hover(
function(){
$(this).find("ul").fadeTo('slow', 0.9);
},
function(){
$(this).find("ul").fadeOut('slow');
}
);
Now the menu is ok. 现在菜单可以了。 The third level don't disapears when I make a hover on the items of the second level.
当我将鼠标悬停在第二层的项目上时,第三层不会消失。
If you have another solution, you can post a new message. 如果您有其他解决方案,则可以发布新消息。
Thanks. 谢谢。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.