Mouse Wheel Scrolling in Tablet Template

[Brandon nobile]

Is there any way to allow scrolling via the mouse wheel in the tablet layout? I can click and drag but I would also like to scroll with the wheel.

[Yurii Orishchuk]

Hi Brandon,

Please make screen shot of your layout and describe or point the place what you want to wheel by mouse.

Regards.

[Brandon nobile]

I would like both sides to scroll independently. This app will be a webapp used to view and modify the forms and documents created by our mobile users. Either side could be longer than the view window will allow depending on the datbase results.

[Brandon nobile]

Yurii, I was able to get the function I was looking for with the following added to "jquery.mobile.scrollview.css":

.ui-scrollview-clip {overflow-y:auto!important;}
::-webkit-scrollbar { width: 0 !important }

This appears to be working, but is there a better way to do this? Thanks

[Yurii Orishchuk]

Hi Brandon,

Unfortunatly currently "scrollview" not supports mouse wheel events.

So your solution is ok if it does what you need.

Also you can manage it with JS code but this solution not an easy to implement. For example listen to "mousewheel" event from scroll container and then set appropriate scroll value with this plugin.

Solution for this:

1 Activate page on which you want this behaviour.

2 Add "Page load" event handler.

3 Populate it with following code:

pre

var scrollers = $('.scroller:visible');

var onmousewheel = function(event){
var scroller = jQuery(this);

Code: Select all

 var position = scroller.scrollview("getScrollPosition"); 

 var wheel = event.originalEvent.wheelDelta; 

 position.y =  position.y - wheel; 

 scroller.scrollview("scrollTo", (-1) * position.x, (-1) * position.y); 

};

scrollers.unibnd("mousewheel").bind("mousewheel", onmousewheel)

/pre

Regards