sitemap
知识分享网:一个值得你收藏的网站!
当前位置:网站首页 > Html > swiper基础使用(八)

swiper基础使用(八)

作者:xuhongji发布时间:2020-09-11分类:Html浏览:61评论:1


导读:这节课我们介绍swiper页面的free模式。第一步,我们还是要创建一个swiper的基础页面。...
这节课我们介绍swiper页面的free模式。

第一步,我们还是要创建一个swiper的基础页面。

H5EDU 1

H5EDU 2

H5EDU 3

H5EDU 4

H5EDU 5

H5EDU 6

H5EDU 7

H5EDU 8

H5EDU 9

H5EDU 10


然后就要在初始化当中添加我们的free模式的属性了

《script》
            var swiper = new Swiper('.swiper-container',{
                pagination:'.swiper-pagination',
                paginationClickable:true,
                slidesPerView:3,
                spaceBetween:30,
                freeMode:true    //free模式开启
            });
        《script》


实现之后我们来观看效果,free模式就是可以将翻页位置在任意位置停止。不再限制在页面当中

以上就是swiper基础使用(八)的内容,更多相关内容请关注HTML中文网(www.cuteur.cn)!


已有1位网友发表了看法:

  • 访客

    访客   评论于 2020-09-11 14:40:22  Firefox 80.0 Windows 10 x64 回复

    JavaScript标签错了

欢迎 发表评论:

Html排行
«   2020年11月   »
1
2345678
9101112131415
16171819202122
23242526272829
30
标签列表
网站分类
文章归档
最近发表
推荐文章