swiper tab switching How can I make the swiper container move by clicking each button
For example, NetEase's top tab switching clicks each button, and the tab switching container will scroll (1: you can scroll left and right, and the content occupies the entire container,)
http://3g.163.com/touch/auto?...
Horizontal scroll scroll
.topnav_list
I made a DEMO: https://codepen.io/anon/pen/d...
It only implements basic functions, and the movement position is not very precise. For actual use, you need to adjust the movement amount yourself.
The principle is to bind a
onClick
listener to each.topnav_item
. When an element is clicked, get the index of the element intopnav_list
, and then shift.topnav_list
to the left accordingly by width * index distance (not an exact value, need to be adjusted).Some syntax of ES2015 is used in DEMO. Please pay attention to browser compatibility when using it in practice. The figure saves trouble by using jQuery’s
.scrollLeft()
method. You can implement one yourself in actual use.