2013-05-14 103 views
0

我已經asp.net菜單喜歡,添加淡入淡出效果菜單鼠標懸停

<asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false" 
       IncludeStyleBlock="false" Orientation="Horizontal"> 
       <Items> 
        <asp:MenuItem NavigateUrl="~/Home.aspx" Text="Home" /> 
        <asp:MenuItem NavigateUrl="~/About.aspx" Text="About" /> 
       </Items> 
      </asp:Menu> 

這裏是我的CSS代碼,

div.menu ul li a, div.menu ul li a:visited 
{ 
border: 1px #4e667d solid; 
color: #666666; 
display: block; 
line-height: 1.35em; 
padding: 4px 20px; 
text-decoration: none; 
white-space: nowrap; 
border-radius: 6px 6px 6px 6px; 
-moz-border-radius: 6px 6px 6px 6px; 
-webkit-border-radius: 6px 6px 6px 6px; 
font-family: Miriam; 
background-color: #F9F9F9; 
} 

div.menu ul li a:hover 
{ 
background-color: #CCCCFF; 
color: #FF6600; 
} 

我讀過this答案並且我已將此代碼添加到我的頁面。

$('#header #menu li a').hover(function() { 
$(this).fadeOut(0).addClass('hover').fadeIn(300); 
}, 
function() { 
$(this).fadeOut(300) 
.queue(function(){ $(this).removeClass('hover').fadeIn(0).dequeue() }); 
}); 

但(淡入/淡出)效果不適用於我,我的代碼中有什麼問題?

+0

我使用jquery-1.4.1 :) – zey 2013-05-14 07:23:56

回答

0
//Source: 

..<body> 
<form id="f1" runat="server"> 
<div id="fadediv" style="display:none"> 
... 
</div> 
</form> 
</body> 


//jquery: 

<script type="text/javascript"> 
$(document).ready(function() { 
     $('#fadediv').fadeIn(2000); 
    }); 
</script> 
相關問題