Swiper中文论坛

标题: 如何处理一张页面中超出屏幕的部分 [打印本页]

---

作者: mango    时间: 2015-10-23 10:53
标题: 如何处理一张页面中超出屏幕的部分
swiper如何处理一张slide超出屏幕的内容，是指如何设置可以滑动查看一个页面超出屏幕的内容，不是滑动切换slide

---

作者: mango    时间: 2015-10-23 11:09
已解决，设置DIV就好了

---

作者: hadesy    时间: 2015-10-23 12:21

mango 发表于 2015-10-23 11:09
已解决，设置DIV就好了

LZ是怎么解决的，能贴下代码吗？

---

作者: raymondj    时间: 2015-10-25 01:01

hadesy 发表于 2015-10-23 12:21
LZ是怎么解决的，能贴下代码吗？

同问。也遇到这问题了。swiper方便整合bootstrap的布局器吗？

---

作者: jieshu    时间: 2015-10-27 17:38
我也遇到了，有一屏时超长的，不知道怎么设置才可以看得到

---

作者: lastcat    时间: 2015-10-30 16:38

raymondj 发表于 2015-10-25 01:01
同问。也遇到这问题了。swiper方便整合bootstrap的布局器吗？

好象不大方便，我就用过。

---

作者: cai    时间: 2015-11-19 19:40
我也遇到了，怎么解决啊，同求

---

作者: cai    时间: 2015-11-19 20:10
已解决，  笑话“聪明绝顶”的案例就是

---

作者: aha2mao    时间: 2015-11-23 22:50

cai 发表于 2015-11-19 20:10
已解决，  笑话“聪明绝顶”的案例就是

大哥 急求 怎么解决的

---

作者: shuang    时间: 2015-12-22 13:31

aha2mao 发表于 2015-11-23 22:50
大哥 急求 怎么解决的

你有没有解决，急求~~~

---

作者: bruceqin    时间: 2016-1-5 15:17
跪求解决方案

---

作者: vvka    时间: 2016-3-3 10:11
不是设置超出部分 隐藏就好了吗？

---

作者: morningflower    时间: 2016-3-11 16:05

mango 发表于 2015-10-23 11:09
已解决，设置DIV就好了

请问怎么解决的，设置什么参数？

---

作者: morningflower    时间: 2016-3-11 16:06

cai 发表于 2015-11-19 20:10
已解决，  笑话“聪明绝顶”的案例就是

哪儿有绝顶聪明的案例？

---

作者: mqy    时间: 2016-4-25 17:10

morningflower 发表于 2016-3-11 16:06
哪儿有绝顶聪明的案例？

http://www.swiper.com.cn/demo/32-scroll-container.html

---

作者: Nstd    时间: 2016-12-28 10:20


思路：
1.设置内容页的overflow

1. 纵向：overflow-y: scroll;
   
2. 横向：overflow-x: scroll;

复制代码

* 注：滚动条的问题请自行google

2. 使用onTouchStar、onTouchMove、onTouchEnd判断内容页是否可滑动（如果不做这个处理，滑动会不太顺畅）
如果可以滑动，锁定swiper：

1. swiper.lockSwipes();

复制代码

然后根据滑动距离（纵向：swiper.touches.currentY - swiper.touches.startY）/（横向：swiper.touches.currentX - swiper.touches.startX）改变内容页的scrollTop/scrollLeft进行滑动
内页滑动结束以后，解锁swiper：

1. swiper.unlockSwipes();

复制代码

使其可以翻页

---

欢迎光临 Swiper中文论坛 (http://bbs.swiper.com.cn/)

Powered by Discuz! X3.2