2

さまざまな jQuery タブに多くの jQuery SlidesJS があります。よく働く。私の問題は、tab2withをクリックして withslide2に戻るtab1とslide1、1 から再起動したいということですslide1! これに対する私のコードは次のとおりです。

<script>
    function start(_start) {
        if(_start != "") {
            starter = _start;
        } else {
            starter = 1;
        }
        $('#slides1, #slides2, #slides3').slides({
            start: starter,
            preload: true,
            slideSpeed: 1000,
            play: 4000,
            pause: 2000,
            slideEasing: 'easeInOutQuint',
            generateNextPrev: false,
            pagination: false,
            next: 'next',
            prev: 'prev'
        });
        $("#tabs").tabs();              
    }

    $(document).ready(function() {
        start(1);

        $("#ui-id-1").click(function(){
            start(1);
        });         
    });
</script>

#ui-id-1ですtab1。それをクリックするとslide11から始まるはずですが、空白の白いdivが表示されます。タブをクリックしたときに 1 から開始する方法はありますか?

4

1 に答える 1

1

これは、slidesjs が非表示の値を計算してheight: 0 width: 0

document解決策は非常に簡単です。readyイベントではなく、ユーザーが実際にタブをクリックしたとき、およびタブの内容が表示された後に、slidesjs を初期化する必要があります。

それが最初に目に見えるものを初期化する方法です:

  $('.bc-slider .frames:visible')).slidesjs({
    width:      1024,
    height:     260,
    play:       {
      auto:   false,
      effect: "slide"
    },
    navigation: {
      effect: "slide",
      active: false
    },
    pagination: {
      active: false,
      effect: "slide"
    },
    effect:     {
      fade: {
        speed: 500
      }
    }
  });

そして、これはショーで非表示のスライダーを表示するコードです:

content.eq(index).find('.frames').slidesjs({
  width:      1024,
  height:     260,
  play:       {
    auto:   false,
    effect: "slide"
  },
  navigation: {
    effect: "slide",
    active: false
  },
  pagination: {
    active: false,
    effect: "slide"
  },
  effect:     {
    fade: {
      speed: 500
    }
  }
});

content現在表示されているタブへの参照を含むイベントローカル変数です。

于 2014-01-10T15:24:56.027 に答える