I've got this script working for grabbing and scrolling a website, and it's perfect; the only problem is I'd like to disable it when clicking a form (basically, not being able to drag scroll when clicking inside a form or input tag). This could be either by specifying a class or ID, whatever works best.
This is the script, in case the website goes down or something:
Code:
<script type="text/javascript">
document.onmousedown = function(){
var e=arguments[0]||event;
var x=zxcWWHS()[2]+e.clientX;
var y=zxcWWHS()[3]+e.clientY;
document.onmousemove=function(){
var e=arguments[0]||event;
window.scroll(x-e.clientX, y-e.clientY);
return false;
}
document.onmouseup=function(){
document.onmousemove=null;
}
return false;
}
function zxcWWHS(){
if (window.innerHeight) return [window.innerWidth-10,window.innerHeight-10,window.pageXOffset,window.pageYOffset];
else if (document.documentElement.clientHeight) return [document.documentElement.clientWidth-10,document.documentElement.clientHeight-10,document.documentElement.scrollLeft,document.documentElement.scrollTop];
else if (document.getElementById("mailForm").onmousedown=null);
return [document.body.clientWidth,document.body.clientHeight,document.body.scrollLeft,document.body.scrollTop];
}
</script>
Also, would there be a way to enable grab scrolling just on the background? I mean, disabling it on images, text and any other element, and just leaving the empty spaces of the website with the ability to scroll.
Thanks a lot in advance.
Last edited by firebrewd; 02-23-2012 at 08:15 PM..
<script type="text/javascript">
document.onmousedown = function()
{
var e=arguments[0]||event;
var x=document.body.scrollLeft+e.clientX;
var y=document.body.scrollTop+e.clientY;
document.onmousemove=function( e )
{
var evt = e || window.event,
srcElem = evt.target || evt.srcElement,
wasBody = srcElem.nodeName === 'BODY';
if( wasBody )
scrollTo(x-e.clientX, y-e.clientY);
return !wasBody;
}
document.onmouseup=function(){
document.onmousemove=null;
}
return false;
}
</script>
Thanks for the reply. But now the script doesn't work at all, even on the body itself. I updated the original post because the script wasn't complete, and there was a function mssing.
Thanks for the reply. But now the script doesn't work at all, even on the body itself. I updated the original post because the script wasn't complete, and there was a function mssing.
I needed to edit the code for I.E. Here's a complete working example.
Thanks man, it works, but there's a tiny problem: what I want to achieve by not being able to drag on forms is to keep the ability to click and write on input tags. If I try to write in the form, though I no longer can drag, I also can write.
Basically, I'd like to entirely disable the script on forms, so the ability to write on them is kept intact. Something like "If the click was done inside a form, do nothing; else, run this script (the one to click and drag)". Can you help on that bit? Thanks a lot, really.
Last edited by firebrewd; 02-24-2012 at 05:40 AM..
Just remove the return false statement at the bottom of the outer function.
It works great! But now when I drag the text and everything else gets selected. Any way to improve that? The perfect solution would be to have return false for everything except forms.