I am using Pep.js for kinetic drag on multi-touch, but my drag events are not being registered because when I try to drag an object in the safari, on iOS, window the window itself moves and follows my drag.
How can I prevent the browser window from following my drag so that the <div>
in my webpage can be dragged?
Here is the webpage in question: http://goo.gl/TsHgh. Click on the link and a <div>
slides in, it is that div that is draggable. It works on desktop browsers, but can not be dragged on multi-touch because safari moves the window along with my drag.
The most straightforward way for disabling scrolling on websites is to add overflow: hidden on the <body> tag. Depending on the situation, this might do the job well enough. If you don't have to support older versions of iOS, you can stop reading here.
Click the Apple menu at the top-left of the screen. Select System Preferences. Click the General preference tab - it's the first one, at the top. Under the Show scroll bars section, select the Always option.
I have found this solution while working with the #ionicframework
CSS:
html, body {
overflow:hidden;
}
JS:
$(window).bind(
'touchmove',
function(e) {
e.preventDefault();
}
);
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With