swiper轮播图

news/2024/7/3 14:37:06 标签: javascript
 <!-- 轮播图 -->
  <div class="swiper-container swiper1">
    <div class="swiper-wrapper">
      <div class="swiper-slide">
        <img src="./images/0.jpg" alt="">
      </div>
      <div class="swiper-slide">
        <img src="./images/1.jpg" alt="">
      </div>
      <div class="swiper-slide">
        <img src="./images/2.jpg" alt="">
      </div>
    </div>
    <!-- 如果需要分页器 -->
    <div class="swiper-pagination"></div>
    <!-- 如果需要导航按钮 -->
    <!-- <div class="swiper-button-prev"></div>
            <div class="swiper-button-next"></div>-->
  </div>
var mySwiper = new Swiper('.swiper1',{
  autoplay: 3000,
  pagination : '.swiper-pagination',    // 如果需要分页器
  paginationElement : 'li',   //分页器的元素
  paginationType : 'bullets', //分页器样式类型
  paginationClickable :true,  //设置为true时,点击分页器的指示点分页器会控制Swiper切换。
  loop : true, //无限轮播
  grabCursor : true, //设置为true时,鼠标覆盖Swiper时指针会变成手掌形状,拖动时指针会变成抓手形状
  // virtualTranslate : true, //虚拟位移
});

http://www.niftyadmin.cn/n/734176.html

相关文章

LWN: 配置lockdown security module

点击上方蓝色字关注我们~Lockdown as a security moduleBy Jonathan CorbetJune 24, 2019像UEFI secure boot&#xff08;安全引导&#xff09;这一类的技术&#xff0c;目的都是为了保证运行的系统软件是发布者指定的版本&#xff08;这里定义一下发布者&#xff0c;是指firmw…

es6 -- 默认参数Default,不定参数Rest,扩展运算符Spread详解

欢迎访问我的个人博客&#xff1a;http://www.xiaolongwu.cn 前言 记录一下在实际开发中&#xff0c;很有用的三个es6的新方法 用法详解 默认参数 function f(x, y13) {// 如果没有传入y或传入了undefined&#xff0c;y的默认值为13return x y; } f(5) // 18 不定参数Rest 不定…

tab选项卡联动swiper轮播图

function tabs(obj, swiperObj, className, index) {var tabSwiper new Swiper(swiperObj, {initialSlide: index, // 设定初始化时slide的索引speed: 500, //滑动速度&#xff0c;单位ms// autoHeight: true, //高度随内容变化onSlideChangeStart: function() {if (tabSwiper…

H5页面调用原生方法返回

var userAgent navigator.userAgent.toLowerCase(); // 调用原生方法返回 function back() {if (equipment(iphone)) {naviBack({ isRefresh: 0, callBack: isRefresh() });} else if (equipment(ipad)) {naviBack({ isRefresh: 0, callBack: isRefresh() });} else if(equipm…

LWN: FreeBSD已经26周年啦!

点击上方蓝色字关注我们~FreeBSD turns 26June 21, 2019This article was contributed by Sean KernerFreeBSD在创建之后&#xff0c;已经活跃开发了26年了。目前活跃开发的领域包括RISC-V处理器支持&#xff0c;FUSE文件系统的更新&#xff0c;C运行时库的改动&#xff0c;以及…

吴恩达:按照这5步,传统公司也可转型人工智能\n

12月13日&#xff0c;吴恩达在自己的创业公司网站Landing.ai上发布了一本《人工智能转型手册》&#xff0c;旨在为传统公司转型AI提供指导和帮助&#xff0c;我们翻译了部分内容&#xff0c;并在文末附上了手册的下载链接&#xff0c;供读者阅读。 以下内容为InfoQ整理翻译&…

判断设备类型android和iphone

$(function () {// 判断设备类型var u navigator.userAgent;var isAndroid u.indexOf(Android) > -1 || u.indexOf(Adr) > -1; //android终端 var isiOS !!u.match(/\(i[^;];( U;)? CPU.Mac OS X/); //ios终端if (isiOS true) {addHeight();}$(.line2:last).css(di…

LWN: 5.2内核改动相关的一些统计数字

点击上方蓝色字关注我们~Statistics from the 5.2 kernel — and beforeBy Jonathan CorbetJune 21, 2019译者注&#xff1a;5.2已经于7月7日正式发布&#xff0c;但LWN此文撰写时5.2尚在开发周期中。截至此时&#xff0c;在5.2开发周期中已经有13600个patch set &#xff08;不…