博客> swiper教程——swiper的基础使用(十九)
swiper教程——swiper的基础使用(十九)
2019-12-05 01:14 评论:0 阅读:708 zhanying
html5 swiper

本文为H5EDU机构官方的HTML5培训HTML5培训教程 swiper教程。

这次内容我们介绍如何在swiper的页面当中添加键盘控制翻页的功能。 开始还是搭建swiper页面。

H5EDU1
H5EDU2
H5EDU3
H5EDU4
H5EDU5

然后在js当中进行初始化并且设定CSS样式。 var swiper = new Swiper('.swiper-container',{ pagination:'.swiper-pagination', slidesPerView:1, paginationClickable:true, spaceBetween:30, nextButton:'.swiper-button-next', prevButton:'.swiper-button-prev', keyboardControl:true //开启键盘控制翻页 });

如上我们只是在初始化当中添加了 keyboardControl:true就可以让swiper页面有键盘控制翻页的效果。如果不添加是不可以用键盘控制页面滚动的 点击进入swiper强化教程: Enter your link description here:

收藏
0
sina weixin mail 回到顶部