Is it possible to scroll content with key up/down?

[CNaik]

Hi Team,

This is about running Onsen UI powered web application on computer browser.

We use scroller class to enable content scrolling. It’s working fine as far as we scroll content using mouse. But it doesn’t scroll content with keyboard up/down keys. If it’s possible, kindly let me know what needs to be enabled.

Regards,
CNaik.

[munsterlander]

@CNaik You would need an event listener for keydown and you would listen for the following key presses:

down = 40
up = 38

In your callback function, you would manipulate the scroll object: Here is one example:

$(".someInput").on("keyup", function(e) {
   $(".wrapper").show(); 
    if (e.which == 40) {
        $('.element:not(:last-child).element-hover').removeClass('element-hover').next().addClass('element-hover');
    } else if (e.which == 38) {
        $('.element:not(:first-child).element-hover').removeClass('element-hover').prev().addClass('element-hover');    
    }
    //scroll to element:
    $(".wrapper .inner_div").scrollTop(0);//set to top
    $(".wrapper .inner_div").scrollTop($('.element-hover:first').offset().top-$(".wrapper .inner_div").height());//then set equal to the position of the selected element minus the height of scrolling div
});

This came from: http://stackoverflow.com/questions/23268193/scrolling-inner-div-on-key-down-and-up

Another: http://stackoverflow.com/questions/19131554/jquery-page-scroll-every-time-down-when-key-press-down-in-single-page

Here is the Onsen Team discussing something similar here: https://community.onsen.io/topic/111/ons-lazy-repeat/5

[CNaik]

@munsterlander thank you for detailed answer.

I was looking if anything is built into Onsen UI. Will work in this direction.

Regards,
CNaik.