js 轮播图自动轮播

以下是使用原生JS实现自动轮播图的代码：

// 获取轮播图容器和图片列表
var slider = document.querySelector('.slider');
var sliderItems = document.querySelectorAll('.slider-item');

// 定义轮播图索引和定时器
var current = 0;
var timer = null;

// 自动轮播函数
function autoPlay() {
  // 隐藏当前图片
  sliderItems[current].style.display = 'none';
  // 索引加1
  current = (current + 1) % sliderItems.length;
  // 显示下一张图片
  sliderItems[current].style.display = 'block';
}

// 启动定时器
timer = setInterval(autoPlay, 2000);

// 鼠标移入停止自动轮播，移出继续自动轮播
slider.onmouseover = function() {
  clearInterval(timer);
}
slider.onmouseout = function() {
  timer = setInterval(autoPlay, 2000);
}

以上代码实现了一个简单的自动轮播图，每隔2秒钟自动切换到下一张图片。当鼠标移入轮播图容器时，停止自动轮播；当鼠标移出轮播图容器时，继续自动轮播。