Question

我知道点击

上的简单java脚本功能

  $(document).ready(function(){
  $(".click").click(function(){
    $(".fade", this).fadeToggle();
  });
});

但我希望点击一个div出现，第二个关闭。喜欢在这个页面http://www.wpbeginner.com/free-wordpress-blog-setup/，但在查看源代码我找不到任何代码。不要担心这个链接不属于我或我的网站

Answer 1

假设您的html看起来像这样：

<a class="click">click</a><br />
<a class="fade1">fade1</a><br />
<a class="fade2">fade2</a><br />

确保默认情况下隐藏您要在点击时显示的那个：

.fade2 { display:none }

然后在jQuery中执行以下操作：

$(document).ready(function(){
  $(".click").click(function(){
    $(".fade1, .fade2").fadeToggle();
  });
});

<强> Here is a fiddle demo

Answer 2

我认为应该这样做

$(document).ready(function(){
    $('.click').click(function(){
        if ($('.first').is(':visible')) {
            $('.first').css('display', 'none');
            $('.second').fadeIn(2000);
        } else {
            $('.second').css('display', 'none');
            $('.first').fadeIn(2000);
        }
    });                  
});

http://jsfiddle.net/57VaZ/

点击时出现一个div，第二个关闭

2 个答案: