swiper tab切換 點(diǎn)選每個(gè)按鈕,怎麼可以讓swiper容器,移動(dòng)
例如網(wǎng)易的 頂部tab切換 點(diǎn)擊每一按鈕 ,tab切換的容器都會(huì)滾動(dòng)(1:可以向左 ,向右滾動(dòng),而且內(nèi)容是佔(zhàn)滿整個(gè)容器的,)
http://3g.163.com/touch/auto?...
業(yè)精于勤,荒于嬉;行成于思,毀于隨。
我做了一個(gè) DEMO:https://codepen.io/anon/pen/d...
只是實(shí)現(xiàn)了基本功能,移動(dòng)位置不是很精確,實(shí)際使用的話需要自己調(diào)校移動(dòng)量。
原理就是給每個(gè) .topnav_item
綁定一個(gè) onClick
的 listener。當(dāng)點(diǎn)擊元素時(shí),取得該元素在 topnav_list
中的 index,然後把 .topnav_list
相應(yīng)地向左位移 width * index 距離(不是精確值,需要調(diào)校)。
DEMO 中用了 ES2015 的一些語(yǔ)法,實(shí)際使用時(shí)需要注意瀏覽器相容性。圖省事用了 jQuery 的.scrollLeft()
方法,實(shí)際使用時(shí)可以自行實(shí)作一個(gè)。