插件描述：支持移动端手势滑动的jQuery幻灯片插件swipeslider.js
使用方法
引用以下文件
<link rel="stylesheet" type="text/css" href="dist/swipeslider.css"> <script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script> <script type="text/javascript" src="dist/swipeslider.min.js"></script>
html
<figure id="full_feature" class="swipslider"> <ul class="sw-slides"> <li class="sw-slide"> <img src="img/summer_beach.jpg" alt="Summer beach concept"> </li> <li class="sw-slide"> <img src="img/lang_yie_ar_kung_fu.jpg" alt="Lang from Yie Ar Kung Fu"> </li> <li class="sw-slide"> <img src="img/tiny_vacation.jpg" alt="Tiny Tina"> </li> <li class="sw-slide"> <img src="img/borderlands_tiny_tina.jpg" alt="Tiny Tina from Borderlands 2"> </li> <li class="sw-slide"> <img src="img/redhead.jpg" alt="Redhead girl"> </li> </ul> </figure>
js
<script type="text/javascript">
$(window).load(function() {
$('#full_feature').swipeslider();
}
</script>
PREVIOUS:
NEXT:
相关插件-幻灯片和轮播图
带各种百叶窗过渡效果的jQuery幻灯片插件
osSlider是一款简单实用的带各种百叶窗过渡效果的jQuery幻灯片插件。该幻灯片插件在slide过渡时随机生成各种百叶窗效果，它使用简单，通过简单的设置即可正常工作。
幻灯片和轮播图
讨论这个项目（28）回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约
）半人半灵的半吊子☆ 0
2020/10/2 17:51:36
-
有办法把左右两边的箭头按照图片大小更改吗😫
西瓜1
2020/10/2 19:45:31
可以，修改样式，主要以下几个参数
.sw-next-prev {
font-family: 宋体;
height: 30px;
width: 30px;
line-height: 30px;
font-size: 20px;
}
）半人半灵的半吊子☆0
2020/10/10 16:13:54
-
抱歉我的意思是figure占位太大，图片不够大导致上下左右都有很大的空白，能不能缩小figure的大小？
唯★美秋@之恋？ 0
2019/11/11 9:49:51
-
点击一下轮播的父元素 轮播功能的两个轮播按钮就失效了 怎么解决？
月季?0
2020/2/18 15:49:51
-
你解决了吗？
月季?0
2020/2/18 15:50:09
-
怎么解决？
顾北清歌寒* 0
2019/2/23 11:43:39
-
怎样关闭自动轮播？
风言枫语1
2019/3/4 17:52:57
$(dom).swipeslider({
// autoPlay:true,
prevNextButtons: false,
bullets: true,
sliderHeight: '55%'
});
鹏程万里0
2023/10/17 11:00:39
$(dom).swipeslider({
autoPlay:false,
prevNextButtons: false,
bullets: true,
});
😃
- 😀
- 😉
- 😥
- 😵
- 😫
- 😘
- 😡
- 👍
- 🌹
- 👏
- 🍺
- 🍉
- 🌙
- ⭐
- 💖
- 💔
😃
取消回复
- 😀
- 😉
- 😥
- 😵
- 😫
- 😘
- 😡
- 👍
- 🌹
- 👏
- 🍺
- 🍉
- 🌙
- ⭐
- 💖
- 💔
