javascript - swiper tab切換 點選每個按鈕,怎麼可以讓swiper容器,移動
迷茫
迷茫 2017-06-14 10:54:16
0
2
717

swiper tab切換 點選每個按鈕,怎麼可以讓swiper容器,移動

例如網易的 頂部tab切換 點擊每一按鈕 ,tab切換的容器都會滾動(1:可以向左 ,向右滾動,而且內容是佔滿整個容器的,)

http://3g.163.com/touch/auto?...

迷茫
迷茫

业精于勤,荒于嬉;行成于思,毁于随。

全部回覆(2)
某草草

橫向 scroll 滾動 .topnav_list

Ty80

我做了一個 DEMO:https://codepen.io/anon/pen/d...

只是實現了基本功能,移動位置不是很精確,實際使用的話需要自己調校移動量。

原理就是給每個 .topnav_item 綁定一個 onClick 的 listener。當點擊元素時,取得該元素在 topnav_list 中的 index,然後把 .topnav_list 相應地向左位移 width * index 距離(不是精確值,需要調校)。

DEMO 中用了 ES2015 的一些語法,實際使用時需要注意瀏覽器相容性。圖省事用了 jQuery 的.scrollLeft() 方法,實際使用時可以自行實作一個。

熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!