將CSS樣式應用於錨問題

使用jquery我有一個單擊選項卡機制，只是錨定標記，返回false但調用JavaScript函數在頁面上運行一些事件。問題是我使用jQuery將不透明度樣式應用於活動錨點。而另一個兄弟錨則獲得較小的不透明度視圖。我的代碼看起來像這樣將CSS樣式應用於錨問題

$("#menutab li a").click(function(){ 
$(this).animate({opacity:'1'},1000); 
    $(this).siblings().animate({opacity:'.25'},1000); 
}

我認爲這個代碼將只有點擊的元素上採取行動並應用CSS樣式到該元素和其他樣式除了點擊一個接一個錨標記。它有這樣做，但它也是做的是離開較早的點擊元素爲opacity = 1，所以如果我點擊一個元素，它將其設置爲1不透明度，然後如果我點擊另一個元素，它將其不透明度設置爲1，而離開之前點擊1到1，而不是像其他人一樣將其設置爲.25。

編輯： 我改變了上面的代碼：

$("#menutab ul li").click(function(){ 
$(this).children().animate({opacity:'1'},1000); 
    $(this).siblings().children().animate({opacity:'.25'},1000); 
});

，現在我得到想要的效果一樣，除了在該列表中的第一錨被點擊不遵守規則的情況下，當第一個點擊它的時候，點擊事件沒有被觸發，因爲沒有不透明樣式改變。我不明白。

來源

2010-04-23 Jake

這工作適合我，甚至當單擊列表中的第一錨：

<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script> 

<script type="text/javascript"> 
$(document).ready(function() { 
    $("#menutab ul li").click(function(){ 
    $(this).children().animate({opacity:'1'},1000); 
     $(this).siblings().children().animate({opacity:'.25'},1000); 
    }); 
}); 

</script> 
<div id="menutab"> 
    <ul> 
     <li><a href="javascript: return false;" >Test1</a></li> 
     <li><a href="javascript: return false;" >Test2</a></li> 
     <li><a href="javascript: return false;" >Test3</a></li> 
     <li><a href="javascript: return false;" >Test4</a></li> 
     <li><a href="javascript: return false;" >Test5</a></li> 
    </ul> 
</div>

來源

2010-04-24 05:26:36

問題謊言，我手動對li html代碼進行更改..因爲你有我的同一個答案，我會給你接受 – Jake 2010-04-26 15:35:31

在.animate()之前加.stop()。

來源

2010-04-23 18:34:20 SLaks

還是做同樣的事情 – Jake 2010-04-23 18:39:56

請給我們演示。 – SLaks 2010-04-23 19:08:58

將CSS樣式應用於錨問題

回答

相關問題