0

我想要两个单独的列表，它们是图像。它们被包裹在两个独立的 div 中，分别是“web”和“nonweb”类。我想要顶部的两个按钮。

当点击“网站设计”按钮时，所有“非网页”内容消失，出现“网页”内容。“网站设计”图像也更改为不同的图像。我将有两个按钮，一个“网站设计”和“非网站设计”。加载页面后，它们都将采用黑白形式。单击一个时，对面的按钮内容将保持隐藏状态，并显示按钮链接的内容。单击的按钮也将变为更亮的按钮。

如果单击另一个按钮，则对面按钮的所有内容都将隐藏，另一个按钮将变回黑白版本，而单击的按钮发生变化，并显示其内容，yada yada yada。

我一直在研究它，似乎找不到正确的方法。检查这个馅饼以获得更详细的代码版本：

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

谢谢！

4

1 回答 1

1

我写了这个，请注意我是大学一年级><

应该按照您的意愿进行操作，只需根据您的需要更改 URL。

<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>
于 2013-02-12T00:33:03.750 回答