1

我正在从头开始创建一个非常简单的幻灯片:

在此处输入图像描述

...运行在 3 个主要变量上:

var slideshowItem_place = 0;
var slideshowItem_position = 0;
var slideshowItem_limit = parseInt($('.slideshowImage_container').length) - 1;

使幻灯片执行的主要功能是这个:

function slideshow_animateSliding(){
  slideshowItem_position = 0 - (slideshowItem_place * 1280);
  $('#slideshowContent').stop().animate({'left':slideshowItem_position + 'px'}, 1000, 'swing');
  }

不过大拇指...

在此处输入图像描述

...我不知道如何让它们在播放时根据可见的幻灯片自动更改。

大拇指代码:

$('#slideshow_thumbsContainer').on('click', '> div:not(.slideshowThumbs_active)', function(){

  var $this_slideshowThumbs_notActive = $(this);
  var $this_slideshowThumbs_active = $('#slideshow_thumbsContainer > div.slideshowThumbs_active');

  function thumbsDeactivate(){
    // Deactivate currently slideshowThumbs_active animation...
  }

  function thumbsActivate(){
    thumbsDeactivate();
    // Activate clicked slideshowThumbs animation...
  }

  thumbsActivate();

});

我的猜测是我应该在运行幻灯片的那个中调用函数thumbsActivate() - slideshow_animateSliding() - 只是无法弄清楚逻辑。

这是我需要的一些伪代码:

  • 如果slideshowItem_place = 0然后运行​​thumbsActivate(#slideshow_thumbOutline01)
  • 如果slideshowItem_place = 1然后运行​​thumbsActivate(#slideshow_thumbOutline02)
  • ETC...

完整的小提琴

谢谢。

佩德罗

4

1 回答 1

0

喜欢

function slideshowAutoplay(){
    if (slideshowItem_place < slideshowItem_limit){
       slideshowItem_place ++;
       $('.slideshow_thumbInner').eq(slideshowItem_place).css('background-color','red');}
    else{
       slideshowItem_place = 0;   
       slideshow_animate();
    }
}
于 2013-07-30T12:35:25.880 回答