Solved

IE scrollbar drag and drop bug

Posted on 2006-07-13
2
229 Views
Last Modified: 2008-03-10
I have a floating div with a onmousedown function to move it. the function sets simpy a var grabbed = true, on mouseup I set grabbed = false. Then I do simply a window.onmousemove and if grabbed is true, then I move the div to follow the pointer. Now the trouble arises if I have a scrollbar on my floating div, if I click on the bar, the onmousedown is executed (thus grabbing the div) but the mouseup is never executed, then the div is never released... the div looks like this :

<div onmousedown='grabit()' onmouseup='releaseit()' id='thediv' style='overflow:auto;height:100'>

<div>

Under firefox it works fine, the bug arises only under IE. How could I arrange this ?
0
Comment
Question by:Drakecoldwinter
2 Comments
 
LVL 2

Author Comment

by:Drakecoldwinter
ID: 17111068
Once again I answer myself trough research, test and error... I have done some code that will ignore the mousedown or up when is over the scrollbar :

var thescrollX = getLeft(document.getElementById('msgbox')) +  
                     document.getElementById('msgbox').offsetWidth - 50;
var thescrollYtop = getTop(document.getElementById('msgbox')) + 15;
var thescrollYbot = getTop(document.getElementById('msgbox')) +
                      document.getElementById('msgbox').offsetHeight - 15;

if((curX>thescrollX )&&(curX<thescrollX+20)&&(curY>thescrollYtop )&&(curY<thescrollYbot)){
                        grabbed=false;}

it is very easy, before doing the onmousedown I check if the cursor is over the scrollbars, if it is the case, I ignore the rest of the code and don't do any drag ;) of course the 50, and 15 must be adjusted for your div ;)
0
 
LVL 5

Accepted Solution

by:
Netminder earned 0 total points
ID: 17117891
Closed, 125 points refunded.
Netminder
Site Admin
0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In this article, we'll look how to sort an Array in JavaScript, including the more advanced techniques of sorting a collection of records either ascending or descending on two or more fields. Basic Sorting of Arrays First, let's look at the …
Article by: DanRollins
This article describes a JavaScript program that creates a maze made of hexagonal cells.  In Part 2 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7850-Hex-Maze-Part-2.html), we'll extend the program by adding a depth-…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

679 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question