jQuery Slider

jQuery Slider 是一个基于 jQuery 的图片轮播插件，可以方便地实现网站的幻灯片效果。

特性

  • 支持响应式设计，在不同设备上自适应布局。
  • 可以设置自动播放、循环播放等功能。
  • 支持多种切换效果，如淡入淡出、滑动、旋转等。
  • 可以自定义导航按钮、分页器等样式。
  • 支持触摸滑动，适用于移动端设备。

使用方法

  1. 引入 jQuery 和 jQuery Slider 插件的 JS 文件：
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="jquery.slider.min.js"></script>
  1. 在 HTML 中添加图片轮播的容器及内容：
<div class="slider">
  <img src="image1.jpg" alt="Image 1">
  <img src="image2.jpg" alt="Image 2">
  <img src="image3.jpg" alt="Image 3">
</div>
  1. 初始化 jQuery Slider：
$(document).ready(function() {
  $('.slider').slider();
});
  1. 可以根据需要设置各种参数，如自动播放、切换效果、导航按钮等：
$(document).ready(function() {
  $('.slider').slider({
    autoplay: true,
    effect: 'fade',
    nav: true
  });
});

参考链接