Javascript滑动图片库 - 没有jQuery

时间:2012-08-12 23:20:45

标签: javascript

有没有人有关于制作纯JS图像滑块的任何提示?我想在每个图像后暂停它并在浏览完所有图像后重新启动。我能找到的只是jQuery插件,我只想用JS做这个。

1 个答案:

答案 0 :(得分:0)

我会选择这样的事情:

var sliderTool = {
    _totalItems : 0,
    _visibleItems : 6,
    _currentOffset : 0,
    _timeout : null,
    next : function(){
        ...
    },
    prev : function(){
        ...
    },
    play : function(){
        ...
    },
    pause : function(){
        ...
    }
};

作为基础。

每次设置超时时,将其保存到_timeout字段,这样您就可以随时clearTimeout(sliderTool._timeout)。 next和prev可以包含动画或仅包含简单的图像替换。您可以为动画和幻灯片之间的间隔添加单独的超时。

你可以在sliderTool和window.load上添加“add()”方法,或者“body onload”添加所有图像,然后运行start()方法。您还可以在加载页面后动态添加图像

也许还可以为自动加载和基本设置添加init()。

再次,这是可能的解决方案的基本草案。一旦你开始跑步,你可能会遇到更具体的问题。总的来说,作为一种方法,我建议在寻求一般性建议之前先尝试提出一些解决方案;)