1.将多个div水平方向上等高居中显示:height:50%;
2.关于swiper的图片展示方向问题:
//Slides的滑动方向，可设置水平(horizontal)或垂直(vertical)。
<script>
var mySwiper = new Swiper ('.swiper-container', {
direction: 'horizontal',//Slides的滑动方向，可设置水平(horizontal)或垂直(vertical)。
initialSlide :2, //设定初始化时slide的索引。
autoHeight: true, //高度随内容变化
})
</script>
3.swiper的自动轮播效果
var mySwiper = new Swiper ('.swiper-container', {
autoplay : 3000,
speed:300,//播放转动动画速度
loop : true,////反方向自动切换简单示例
})
4,swiper鼠标抓取图片时,展示位手:
var mySwiper = new Swiper ('.swiper-container', {
grabCursor : true,
})
5.对于属性history的描述
在slide切换时无刷新更换URL和浏览器的history.state(pushState)。这样每个slide都会拥有一个自己的URL。
使用history还必需在slide上增加一个属性data-history，例<div class="swiper-slide" data-history="slide1"></div>
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide" data-history="1">
Slide 1</div>
<div class="swiper-slide" data-history="Slide 2">
Slide 2</div>
<div class="swiper-slide" data-history="3">
Slide 3</div>
</div>
</div>
<script>
var swiper = new Swiper('.swiper-container', {
history: 'love',
});
</script>
6.图片轮播切换的效果
slide的切换效果，默认为"slide"（位移切换），可设置为"fade"（淡入）"cube"（方块）"coverflow"（3d流）"flip"（3d翻转）。
用法:slide的切换效果，默认为"slide"（位移切换），可设置为"fade"（淡入）"cube"（方块）"coverflow"（3d流）"flip"（3d翻转）。
effect : 'coverflow',
7.swiper的一些了点击事件clicks;
preventClicks :当swiper在触摸时阻止默认事件（preventDefault），用于防止触摸时触发链接跳转。
preventClicksPropagation: 滑动slide时触发事件:
<div class="swiper-slide" onclick="alert('你点了Swiper')">
<script language="javascript">
var mySwiper = new Swiper('.swiper-container',{
preventLinksPropagation : false,
})
</script>
slideToClickedSlide:点击之后会,被点击的slide会居中显示 类型true 或者是false
http://www.swiper.com.cn/api/basic/2016/1029/317.html swiper教程
