jQuery SlidesJS

时间:2013-01-25 10:27:17

标签: jquery tabs slidesjs

我在不同的jQuery选项卡中有很多jQuery SlidesJS。效果很好。我现在的问题是,当我点击tab2slide2并且我带着tab1返回slide1时,我想重新启动slide1在1!我的代码是:

<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-1tab1。点击它应该从1开始slide1但是我得到的是一个空白的白色div。我点击标签时如何从1开始的任何想法?

1 个答案:

答案 0 :(得分:1)

这就是slidejs将不可见值计算到height: 0 width: 0

的问题

解决方案很简单:你应该在document就绪事件时初始化slidejs,但是当用户实际点击一个标签并显示标签内容后。

这就是我首先看到的方式:

  $('.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是一个事件本地变量,包含对正在显示的选项卡的引用。