如何消除先前li元素的背景圖像

正如您所看到的，在懸停li元素時，右邊的背景圖像在background-image:none屬性的幫助下也隨着消失。但是隻有h li的李纔會消失，但前面李的背景圖像仍然可見。雖然是未成年人，但我希望將其刪除。誰能告訴我如何？ :)如何消除先前li元素的背景圖像

因爲我是新的，我不允許張貼圖像。檢查網站在http://ashwin931996.webege.com/ 非常感謝btw

來源

2012-10-30 Ashwin Vasudevan

你準備使用jquery？ – Selvamani

不，我不知道jquery，對不起。有沒有其他想法？ –

http://docs.jquery.com/ - 你不會後悔的。 :-) – techfoobar

使用此jquery。在這裏我粘貼完整的html代碼。用這個。

<!DOCTYPE html> 
<html> 
<head> 
<title></title> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js"></script> 
<link type="text/css" rel="stylesheet" href=""/> 
<style type="text/css"> 
#header ul { 
    padding-top:1em; 
     } 

    #header ul li a.currentpage { 
    color:white !important; 
    background-color: #F96E5B !important; 
    } 

    #header ul li a { 
    text-decoration: none; 
    color:#676767; 
    font-family: 'Oswald', sans-serif; 
    font-size: 1em; 
    float:right; 
    line-height: 3em; 
    padding-right: 1em; 
    padding-left:1em; 
     } 


#header ul li a.active 
{background-color: #F96E99; 
color: white;} 


</style> 
</head> 
<body> 
<div id="header"> 
<img id="logo" src="images/logo.jpg"> 
<ul> 
<li> 
<a class="one active" href="#">CONTACT</a> 
</li> 
<li> 
<a class="two" href="#">GALLERY</a> 
</li class="one"> 
<li> 
<a class="three" href="#">EVENTS</a> 
</li> 
<li> 
<a class="four" href="#">HOME </a> 
</li> 
</ul>   
</div> 
<script type="text/javascript"> 
$("#header ul li a").click(function() { 
$("#header ul li a").removeClass("active"); 
$(this).addClass("active"); 
}) 
</script> 


</body> 
</html>

演示：http://jsfiddle.net/PbMg2/2/

來源

2012-10-30 14:09:45 Selvamani

謝謝，它工作。 :) –

歡迎，不要忘了添加這一行'' – Selvamani

如何消除先前li元素的背景圖像

回答

相關問題