2015-12-29 4 views
2

Пробовал это JS-FIDDLE Но не получилось. Может ли кто-нибудь помочь, как включить навигацию по клавиатуре для этого слайдера.Навигация на клавиатуре для cbp full slider ползунка

_toggleNavControls : function() { 

     // if the current item is the first one in the list, the left arrow is not shown 
     // if the current item is the last one in the list, the right arrow is not shown 
     switch(this.current) { 
      case 0 : this.$navNext.show(); this.$navPrev.hide(); break; 
      case this.itemsCount - 1 : this.$navNext.hide(); this.$navPrev.show(); break; 
      default : this.$navNext.show(); this.$navPrev.show(); break; 
     } 
     // highlight navigation dot 
     this.$navDots.eq(this.old).removeClass('cbp-fwcurrent').end().eq(this.current).addClass('cbp-fwcurrent'); 

    } 

Anyhelp был бы благодарен.

+0

Что вы имеете в виду с клавиатуры навигация? вы хотите управлять слайдером стрелками на клавиатуре? –

+0

Абсолютно! Я хочу контролировать свои слайды с помощью клавиатуры и мыши. @Anas Omar – tata

ответ

2

see demo

Вы должны связать KeyDown событие на документ в _initEvents функций и смотреть клавиши со стрелками влево и вправо для нажат:

$(document).keydown(keyHandler); 

function keyHandler(event) { 
     if (event.keyCode === 39) { 

      if(self.$navNext.is(":visible")) self.$navNext.trigger("click.cbpFWSlider"); 
      return false; 
      } else if (event.keyCode === 37) { 
      if(self.$navPrev.is(":visible")) self.$navPrev.trigger("click.cbpFWSlider"); 
      return false; 
      } 

    }; 

P.S. В Jsfiddle не забудьте поставить фокус в область предварительного просмотра, щелкнув по нему - правую нижнюю часть, так что клавиши просматриваются.