使用箭头键控制BXSLIDER

时间:2013-02-21 02:50:51

标签: bxslider

你能帮我解决这个问题。当我按下下一个键(右箭头)时,我试图将箭头控件(左和右)集成到BxSlider,最后一个滑块图像显示出来,而不是显示下一个滑块图像然后与前一个键相同的东西(左箭头)当我按下它时,第一张图像显示出来。 这是我正在使用的代码

jQuery('.bxslider').bxSlider({
pagerCustom: '#bx-pager',
nextSelector: '#slider-next',
prevSelector: '#slider-prev',
nextText: '',
prevText: '',
onSliderLoad: function(){ jQuery('#listing-slider').show();}
});

2 个答案:

答案 0 :(得分:10)

这是一种方法。希望它有所帮助。

// save slider has a global var
var slider = $('.bxslider').bxSlider({
    // your bxSlider options here...
});
// set keyboard listener
$(document).keydown(function(e){
    if (e.keyCode == 39) // Right arrow 
    {
        slider.goToNextSlide();
        return false;
    }
    else if (e.keyCode == 37) // left arrow
    {
         slider.goToPrevSlide();
        return false;
   }
});

答案 1 :(得分:1)

这是在版本4.2.2

中添加的

从更改日志中输入

增强功能:添加了键盘箭头左右支撑(#239