【发布时间】:2011-11-12 12:53:11
【问题描述】:
我碰巧在 Opera 中查看了我(愚蠢地)几个星期没有完成的网站,却发现我的下拉菜单完全损坏了。当我将鼠标悬停在父项上时,所有菜单项都会移动,因此菜单会中断。这在我检查过的任何其他浏览器中都不会发生。
任何人都可以在我的代码中看到任何可能导致它的东西吗?
谢谢
$(document).ready(function () {
$('#nav li').hover(
function () {
$('ul', this).slideDown(200);
},
function () {
$('ul', this).slideUp(100);
}
);
});
CSS
ul#nav {list-style: none; white-space: nowrap; float: right; position: absolute; bottom: 10px; right: 0;}
ul#nav li {display: inline; margin-right: 10px; padding: 0 10px; position: relative; text-transform: uppercase;}
ul#nav li.last {margin-right: 0;}
ul#nav li.slash {padding: 0;}
ul#nav li a {text-transform: uppercase; font-size: 12px; color: black; padding: 10px 0 10px 10px; margin-bottom: 10px;}
ul#nav li a:hover {text-decoration: underline;}
ul#nav li a.active {font-style: normal; text-decoration: underline;}
ul#nav li a.active:hover {color: black;}
ul#nav li.parent_selected, ul#nav li.selected {font-style: italic;}
#nav li ul {position: absolute; top: 26px; right: 0; padding: 20px 0 10px 20px; background-color: #f6f6f6; border: 1px solid #ccc; text-align: right; z-index: 999;}
#nav li ul li {display:block; margin-bottom: 10px; padding: 0;}
#nav li ul li a {text-transform: none; font-size: 12px; color: black;}
#nav li ul li a:hover {text-decoration: underline;}
由于它似乎在所有主要浏览器(Opera 除外)中都可以使用,所以我很犹豫是否要摆弄它,直到我不知道哪里出了问题。
谢谢
【问题讨论】:
-
您能否在JS Fiddle 中重现问题,以便我们可以看到问题,而不是尝试从您的 jQuery 和 CSS 中推断出问题?
-
谢谢大卫,这里是jsfiddle.net/WctpW
-
奇怪的小提琴似乎在 Opera 中工作!
标签: jquery css opera drop-down-menu