Basics 1K - Keyboard Support

This is a carousel that can be controlled using the arrow keys or the “WASD” keys.

Tap the text field to trigger the virtual keyboard or to focus on this carousel:

Usage:

1. To add keyboard support, add an onkeydown event listener.

   
   document.onkeydown = function (ev) {
       console.log(ev.keyCode);
       // previous = W (87), A (65), up (38), left (37)
       // next = S (83), D (68), down (40), right (39)
   
       if (ev.keyCode === 87 || ev.keyCode === 65 || ev.keyCode === 38 || ev.keyCode === 37) {
           Panther.Carousel.turnPrev('carousel1')
       }
       else if (ev.keyCode === 83 || ev.keyCode === 68 || ev.keyCode === 40 || ev.keyCode === 39) {
           Panther.Carousel.turnNext('carousel1')
       }
   }
                                   

Hello World!

The quick brown fox jumps over the lazy dog.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed eu tempor ligula. Suspendisse ut porttitor ipsum, at viverra metus. Phasellus vitae dictum turpis, eu ultricies lacus. Vestibulum cursus pretium lectus ac accumsan. Ut fringilla vulputate nisl. Suspendisse porta nisi neque, vitae imperdiet ligula fringilla et. Aenean sagittis ante in lectus cursus, non sodales tortor pellentesque. Etiam lobortis quam eu nisi fermentum ultricies. Vestibulum viverra pulvinar enim. Cras commodo velit metus, non ultricies est rutrum sed. Phasellus gravida augue vel imperdiet mattis.