刪除所有圖像的不透明度，但用jquery點擊一下

如何從不點擊的所有元素中去除不透明度。我有一組網格圖案的圖像。我希望能夠點擊其中的任何一個來讓剩下的部分消失。我現在可以做到，但我想讓它更具活力。刪除所有圖像的不透明度，但用jquery點擊一下

<script> 
$(document).ready(function() { 
$('#grid').click(function() { 
    $('#book').animate({ 
    opacity: '0'. 
    }, 1500, function() { 
      }); 
     }); 
    }); 
</script> 

</head><body> 

    <div class="portfolio"> 
    <ul id="grid"> 
     <li><a href="#"id="book"><img src="1.jpg"></a></li> 
     <li><a href="#"id="book1"><img src="2.jpg"></a></li> 
     <li><a href="#"id="book2"><img src="3.jpg"></a></li> 
     <li><a href="#"id="book3"><img src="4.jpg"></a></li> 
     <li><a href="#"id="book4"><img src="5.jpg"></a></li> 
     <li><a href="#"id="book5"><img src="6.jpg"></a></li> 
     <li><a href="#"id="book6"><img src="7.jpg"></a></li> 
     <li><a href="#"id="book7"><img src="8.jpg"></a></li> 
     <li><a href="#"id="book8"><img src="9.jpg"></a></li> 
    </ul></div>

我想是這樣，如果 id不包含ID點擊不透明度= 0

來源

2013-07-23 Wanting to learn

...你怎麼打算讓他們都再次可見？ –

我只是寫另一個功能，讓他們回來，試圖給寶貝踩一步吧 –

你不需要如此混亂的ID，保持簡單。

<div class="portfolio"> 
<ul id="grid"> 
    <li><a href="#"><img src="1.jpg"></a></li> 
    <li><a href="#"><img src="2.jpg"></a></li> 
    <li><a href="#"><img src="3.jpg"></a></li> 
    <li><a href="#"><img src="4.jpg"></a></li> 
    <li><a href="#"><img src="5.jpg"></a></li> 
    <li><a href="#"><img src="6.jpg"></a></li> 
    <li><a href="#"><img src="7.jpg"></a></li> 
    <li><a href="#"><img src="8.jpg"></a></li> 
    <li><a href="#"><img src="9.jpg"></a></li> 
</ul> 
</div>

每個事件（點擊你的情況）被委派到一個元素，在JS被稱爲target。
jQuery爲你的情況也有一些不錯的選擇器，如.siblings()，它將針對所有其他元素而不是當前的元素。

$(function() { 
$('#grid li').click(function() { 
    $(this).siblings().animate({opacity: '0'}, 1500); 
}); 
});

http://jsfiddle.net/Cnjjx/

來源

2013-07-23 00:19:40

您是否嘗試過使用CSS？也許有兩個類 img.clicked { opacity=1.0; } img.notClicked { opacity=0.0; } 然後使用jQuery來設置類。

來源

2013-07-23 00:19:08 smakateer

我試過你的代碼smakateer，但它似乎並沒有工作 –

刪除所有圖像的不透明度，但用jquery點擊一下

回答

相關問題