お客様から、「スライダー(bxSlider使用)でページャーやprevボタンとかnextボタンのスライドリンクを連打したら変な動きになる!」とクレームが来ました。
連打て・・・と思いつつやってみると確かに何か挙動がおかしい。
ページャーが途中で効かなくなったり、スライドリンクしてると動きがおかしくなる。
クソ忙しい時に・・・と思いつつとにかく色々調べました。
「bxslider 連打 おかしく」とか「bxslider pager error」とか・・・半日くらいgoogleやソースとにらめっこした結果、「スライド中はイベントを切る」というものでなんとかできました。
speedのパラメータが大きいほど連打ができなくなりますが仕方ないです。以下ソース。
※cssのpointer-eventsはインライ要素には効かない点注意。
var slider = $('.slider').bxSlider({ speed: 2000, pause: 4000, onSlideBefore: function(){ $('.bx-controls-direction a').css('pointer-events', 'none'); $('.bx-pager a').css('pointer-events', 'none'); }, onSlideAfter: function(){ $('.bx-pager a').css('pointer-events', 'auto'); $('.bx-controls-direction a').css('pointer-events', 'auto'); slider.startAuto(); } });