0

私は自分の問題をいじっています。リンクのリストがあり、それぞれが異なるスライドショーを開きます。私が望むのは、リンクをクリックするときに、開いているスライドショーがあるかどうかを確認し、新しい div が下にスライドする前にそれを閉じる (上にスライドする) ことです。私が今持っている方法は一種の機能ですが、最初に既存のスライドショーを閉じて（上に）新しいものを下にスライドさせるのではなく、新しいdivが開いているものの上にスライドするように見えます。

HTML

<body>
  <div id="slide1-project" class="flexslider">
    <div class="close-project">Close (X)</div>
    <div>Slideshow 1</div>
  </div>

  <div id="slide2-project" class="flexslider">
    <div class="close-project">Close (X)</div>
    <div>Slideshow 2</div>
  </div>

  <div id="slide3-project" class="flexslider">
    <div class="close-project">Close (X)</div>
    <div>Slideshow 3</div>
  </div>

  <div id="work-list">
    <ul>
      <li class="client" id="slide1">Section1</li>
      <li class="client" id="slide2">Section2</li>
      <li class="client" id="slide3">Section3</li>
    </ul>
  </div><!-- End work-list -->

</body>

JS

$(document).ready(function() {

  $(".close-project").click(function(){
    $(".flexslider").slideUp("slow");
    $("#work-list ul li").removeClass("current");
  });

  $(".client").click(function() {
    var project = this.id;
    var project_id = '#' + project + '-project';
    $(".flexslider").slideUp('slow');
    $(project_id).slideDown('slow', function() {
        $(project).addClass("current");
    });
  });
});

誰かがコードを修正するのを手伝ってくれますか?

また、対応するスライドを開いたときにリンクの色が変わるようにしたいのですが、今のままではうまくいきません。誰かがそれを手伝ってくれるなら、私はそれを感謝します。

4

1 に答える 1

2

一度に複数のアイテムがスライドするため、問題が発生していると思います。このjsfiddleで解決策を確認してください

JavaScript

     $(function () {
        $(".close-project").click(function () {
           $(".flexslider").slideUp("slow");
           $("#work-list ul li").removeClass("current");
        });

        $(".client").click(function () {
           var project = this.id;
           var project_id = '#' + project + '-project';

           var elem  = $(".flexslider:visible").length? $(".flexslider:visible") : $(".flexslider:first")
           elem.slideUp('slow', function () {
              $(project_id).slideDown('slow', function () {
                 $(project).addClass("current");
              })
           });

        });
     });
于 2013-05-04T00:51:11.627 に答える