3

我正在使用具有四个类之一的小 div 网格,我希望能够使用 onclick 事件淡入和淡出类。例如,如果有 10 个 div,其中三个被归类为“class1”;单击菜单中的链接后,所有但 class1 div 都淡化为完全隐藏或几乎不可见。类似地,其他链接会为“class2”或“class3”等触发相同的效果。还需要一种方法将它们全部恢复。如果有人对已经做到这一点的东西有想法,我将不胜感激朝那个方向推进。

4

4 回答 4

2

使用切换很容易完成:

$(document).ready(function() {
    $('#IDOfLink').click(function() {
        $('.class1').toggle("slow");//switch to show/hide when clicked
    });

    $('#anotherLinkID').click(function() {
        $('.class2').toggle("fast");//switch to show/hide when clicked
    });
    //...etc...
});

标记看起来像:

<a id="IDofLink">Click here to toggle divs with the class of class1</a>

<div class="class1">Blah blah</div>
<div class="class1">Another class1 div</div>
于 2009-08-17T22:39:28.033 回答
2

这就是 jQuery 的核心!你想要这样的东西:

$("#link-that-will-be-clicked").click(function() {
    $(".class2,.class3,.class4").fadeOut();
});

为了使解决方案更简洁,我建议提供所有sadiv通用类,例如common-class除了class1. 所以你可能有:

<div class="common-class class1"></div>

这将让你写一些简单的东西:

$("#link-that-will-be-clicked").click(function() {
    $(".common-class:not(.class1)").fadeOut();
});

并恢复所有:

$(".common-class").fadeIn();
于 2009-08-17T22:40:26.783 回答
0
$(".class1").fadeOut();

有关更多详细信息,请参阅jQuery 文档。使用 fadeIn() 你可以把它们带回来。

于 2009-08-17T22:38:16.773 回答
0

jquery 已经这样做了:

$(".class1").fadeOut("slow");
$(".class1").fadeIn("slow");
于 2009-08-17T22:39:04.523 回答