jQuery - 更改圖像並隱藏

Question

我想要有兩個單獨的圖像列表。它們被包裝在兩個獨立的div中，分別是「web」和「nonweb」類。我想在頂部有兩個按鈕。

點擊「網站設計」按鈕後，所有「非網頁」內容都會消失，並顯示「網頁」內容。 「網站設計」圖片也改變爲另一種。我將有兩個按鈕，一個是「網站設計」和「非網站設計」。在加載頁面時，它們都將以黑色和白色的形式出現。當點擊一個按鈕時，相反的按鈕內容將保持隱藏狀態，鏈接的內容將出現。點擊的按鈕也將變爲更亮的按鈕。

如果點擊另一個按鈕，所有相反按鈕的內容都會自己隱藏，而另一個按鈕將變回黑白版本，而點擊按鈕更改，它的內容出現，yada yada yada。

我一直在努力，而且似乎無法找到正確的方法來做到這一點。 選中此pastie一個稍微更詳細的版本代碼：

http://pastie.org/private/6b5voiypsdbzfnjogj77g

謝謝！

Answer 1

我寫了這個，請注意我在大學一年級> <

應該做你想要的，只是改變網址，您的需求。

<script> 
$(document).ready(function(){ 
    $("div.nonweb").hide(); // hide nonweb content by default 
    $("div.web").hide(); // hide web content by default 

    $("img.webdesigntop").click(function(){ 
     $("img.webdesigntop").attr("src", "http://www.plaatsoft.nl/wp-content/uploads/RedSquare.jpg"); // color webdesigntop button 
     $("img.nonwebdesigntop").attr("src", "https://twimg0-a.akamaihd.net/profile_images/1287988344/blue-square_normal.jpg"); //grayscale nonwebdesigntop button 
     $("div.nonweb").hide("fast"); // hide nonweb content 
     $("div.web").show("slow"); // show web content 
    }); 

    $("img.nonwebdesigntop").click(function(){ 
     $("img.webdesigntop").attr("src", "https://twimg0-a.akamaihd.net/profile_images/1287988344/blue-square_normal.jpg"); //grayscale webdesigntop button 
     $("img.nonwebdesigntop").attr("src", "http://www.plaatsoft.nl/wp-content/uploads/RedSquare.jpg"); //colour nonwebdesigntop button 
     $("div.web").hide("fast"); // hide web content 
     $("div.nonweb").show("slow"); // show nonweb content 
    }); 
}); 
</script>