我在网站上有一个菜单。 它在里的右边有一个分隔线,这被设置为背景。 当您将鼠标悬停在上面时,它会消失并且链接会突出显示。
我还想让左边的li背景也消失,我该怎么做?
.menu-link ul li
{
text-decoration:none;
float:left;
background: url(/Content/img/border-line-inside.png) no-repeat right;
}
.menu-link ul li a {
color:#fff;
padding: 0px 15px 0px 15px;
line-height:40px;
display: block;
width:128px;
text-align:center;
}
.menu-link a:hover{
background:url(../img/menu-nav-hov.png) repeat-x;
cursor:pointer;
}
我猜我可能需要使用 jquery?
最佳答案
由于无法选择父元素,也无法在 CSS 中选择之前的兄弟元素,因此您确实需要 jQuery。
类似于 this可能会让你朝着正确的方向前进。 (jQuery 代码可能会得到改进,我不是专家)。
$(document).ready(function() {
$('a').hover(function() {
$(this).parent().prev().css('background','none');
},
function() {
$(this).parent().prev().css('background','url(http://placekitten.com/10/20) no-repeat right');
})
})
关于jquery - 如何让菜单左里背景消失?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8850238/