https://omniflash.cc/static/js/my-image-carousel.js

1/**
2 * my-image-carousel.js
3 *
4 * 轻量图片轮播组件
5 *
6 * 使用方式：
7 *   ImageCarousel.init('carousel-image', [
8 *     '/static/image/a.jpg',
9 *     '/static/image/b.jpg',
10 *     '/static/image/c.jpg'
11 *   ], 3000);
12 *
13 *   // 返回 timerId，可用 clearInterval 停止
14 *
15 * 参数：
16 *   @param {string} imgId       - <img> 元素的 id
17 *   @param {string[]} images    - 图片 URL 数组（至少 1 张）
18 *   @param {number}   interval  - 切换间隔（毫秒），默认 3000
19 */
20
21(function () {
22  'use strict';
23
24  window.ImageCarousel = {
25
26    /**
27     * 初始化轮播
28     * @param {string} imgId    - img 标签的 id
29     * @param {string[]} images - 图片路径数组
30     * @param {number} interval - 轮播间隔（毫秒），默认 3000
31     * @returns {number} setInterval 的 ID，可用于 clearInterval 停止
32     */
33    init: function (imgId, images, interval) {
34      if (!imgId || !images || images.length === 0) {
35        console.warn('[ImageCarousel] 参数无效，跳过初始化');
36        return null;
37      }
38
39      interval = interval || 3000;
40
41      // 如果只有一张图，不需要轮播
42      if (images.length === 1) return null;
43
44      var currentIndex = 0;
45      var imgEl = document.getElementById(imgId);
46
47      if (!imgEl) {
48        console.warn('[ImageCarousel] 未找到元素: #' + imgId);
49        return null;
50      }
51
52      var timerId = setInterval(function () {
53        currentIndex = (currentIndex + 1) % images.length;
54        imgEl.src = images[currentIndex];
55      }, interval);
56
57      console.log('[ImageCarousel] 初始化完成: #' + imgId + ', ' + images.length + '张, 间隔' + interval + 'ms');
58      return timerId;
59    }
60  };
61
62})();