努力让第n个有悬停的孩子在IE工作

Struggling to get nth child with hover to work in IE

本文关键字：孩子 IE 工作 悬停 努力      更新时间：2023-09-26

首先我知道第n个孩子在IE中是不可编译的。所以我必须使用jQuery或Selectivizr使第n个：孩子能在IE中工作（或者有其他方法吗？）。

这里有一个指向jsfiddle的链接http://jsfiddle.net/kncdM/.第9个、第10个和第11个UL标签必须重新定位以防止它们溢出。

我该怎么做？

我已经尝试过使用jQuery来实现这一点，但是它似乎不起作用。我使用了以下代码

$( document ).ready(function() {
    $("ul:nth-child(9) li:hover ul").addClass("nth-child9");
});

添加以下CSS：

#menu .nth-child9
top: initial; 
bottom: -60px;

有人能谈谈如何让下面的代码在IE中工作吗。谢谢

$('ul:nth-child(9) li').on('hover', 'ul', function() {
   $(this).addClass("nth-child9");
});

但是，如果您所做的只是添加两个样式声明，为什么不使用CSS呢？

ul:nth-child(9) li:hover ul {
    top: initial; 
    bottom: -60px;
}

这是一篇非常古老的帖子，但被marc_s的编辑（清理拼写等）复活了。我仍然会提供一个答案，因为这是一个问答；毕竟是一个网站。

正如我在评论中所说，在加载时向第n个子级添加一个类，然后相应地编写CSS会更有意义。从语义上讲，这很简单，而且它只允许您编写一个addClass函数，而不是附加一个事件处理程序。

jQuery

$("ul:nth-child(9)").addClass("nth-child9");

CSS

ul.nth-child9 li:hover ul {
    top: initial; 
    bottom: -60px;
}
相关文章：