Question

为什么slideDown在此代码中不起作用

$(".btn-more").click(function(){
                if ($(this).parent().is(".open") ) {
                    $(this).parent().prev().slideToggle(100);
                    $(this).parent().removeClass('open');
                    $(this).html("read more..");
                }
                else {
                    $(this).parent().prev().slideToggle(100);
                    $(this).parent().addClass('open');
                    $(this).html("read less..");
                }

Html

<div id="content">
   <p>
       <span></span>
   </p>
   <span id="read-more"></span>
   <div class="more active" id="preface-more">
       <a class="btn-more" id="preface-more-btn" href="#"></a>
   </div>

我现在遇到的是幻灯片工作，但滑动不会滑动只是显示，即使我使用slideToggle ..任何建议吗？

谢谢..

Answer 1

Please check the below code.
(function(){
    $(".btn-more").click(function(){
        //$("#read-more").toggle();You can use toggle also
     if($("#read-more").is(".open")) {
        $("#read-more").slideUp(100);
        $("#read-more").removeClass('open')
        $(this).html("read more..");
      }else{
        $("#read-more").addClass('open')
        $("#read-more").slideDown(100);
        $(this).html("read less..");
      }
    });
});
<div id="content">
   <p>
       <span></span>
   </p>
   <span id="read-more" class="open">data dat data data</span>
   <div class="more active" id="preface-more">
       <a class="btn-more" id="preface-more-btn" href="#">Read less</a>
   </div>
</pre>

为什么这个slideUp / slideDown不能与jquery一起使用？

1 个答案: