Javascript 滑动图片库 - 没有 jQuery

Javascript sliding Image Gallery - no jQuery

本文关键字：没有 jQuery 图片库 Javascript      更新时间：2023-09-26

有人对制作纯JS图像滑块有任何技巧吗？我希望让它在每个图像后暂停，并在浏览所有图像后重新启动。我能找到的只是jQuery插件，我希望只用JS来做到这一点。

我会选择这样的东西：

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

作为基础。

每次设置超时时，请将其保存到_timeout字段中，以便随时清除超时（sliderTool._timeout）。Next 和 Prev 可以包含动画或只是简单的图像替换。您可以为动画和幻灯片之间的间隔添加单独的超时。

您可以将"add（）"方法添加到滑块工具中，并在window.load或"body onload"上添加所有图像，然后运行start（）方法。 您还可以在加载页面后动态添加图像

也许还可以添加 init（） 用于自动加载和基本设置。

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

相关文章：