p2p.wrox.com Forums

p2p.wrox.com Forums (http://p2p.wrox.com/index.php)
-   BOOK: Professional JavaScript for Web Developers ISBN: 978-0-7645-7908-0 (http://p2p.wrox.com/forumdisplay.php?f=174)
-   -   Drag and Drop Javascript (http://p2p.wrox.com/showthread.php?t=41657)

mcornes April 24th, 2006 04:56 AM

Drag and Drop Javascript
 
I am currently working through the Professional JavaScript book and am enjoying the Drag and Drop chapter. However I have found that some DIVs don't release the mouse after lifting the button up. Instead the DIV just follows mouse permenantly and I have to refresh the entire page to get my mouse back. Can anyone offer any suggestion how I can fix this ?


vinod_yadav1919 April 24th, 2006 09:20 AM

Hi Mcornes!
try to check event handler on mouse up/release,if possible post the code .



Cheers :)

vinod

mcornes April 24th, 2006 11:57 AM

I have just used and expanded on the chapter 13 example. The same problem can be observed in the example code. It's as if the drag and mouse up event are getting confused and then the div follows the mouse even if the mouse button isn't down. This is present in Safari, Firefox and Internet Explorer


nzakas April 24th, 2006 12:11 PM

Which example are you using (what's the filename?)? Have you made any changes to the example? If so, it would be helpful if you could describe the changes you've made.

Nicholas C. Zakas
Author, Professional JavaScript for Web Developers (ISBN 0764579088)
http://www.nczonline.net/

mcornes April 24th, 2006 12:17 PM

ZDragExample.htm

I have made changes but the problem is present in the standard file. Whereby the mouse doesn't release a div and it just continues to follow it around.


nzakas April 24th, 2006 12:30 PM

What exactly are you doing in the example to make this happen? I've now tried it a couple times in both IE and Firefox and can't seem to reproduce the issue you describe.

Nicholas C. Zakas
Author, Professional JavaScript for Web Developers (ISBN 0764579088)
http://www.nczonline.net/

mcornes April 24th, 2006 01:05 PM

Dragging a div around the screen, you will find the arrow becomes a verticle bar, and ocassionally slips off the div and becomes a circle with a strike through it. I find then that div wouldn't let go of the mouse, as it were.

To make sure it happens so you can see it - drag the div around very fast and that usually make the problem occure.


pepejeria April 29th, 2006 07:02 PM

I also see this issue, but only in Firefox.

I noticed that the issue is fixed by adding the following CSS:
Code:

body
{
    height:100%;
    width:100%;
}

But a better solution would be to update the zdragdroplib.js. Change the following lines:
Code:

// In the attachEventHandlers method
document.body.addEventListener("mousemove",this.tempMouseMove,false);

// In the detachEventHandlers method
document.body.removeEventListener("mousemove",this.tempMouseMove,false);

with:
Code:

// In the attachEventHandlers method
document.addEventListener("mousemove",this.tempMouseMove,false);

// In the detachEventHandlers method
document.removeEventListener("mousemove",this.tempMouseMove,false);

Note that the body height in standard compliance mode is equal to the content, so attaching the event to the document.body would fail on a page with no content and one draggable div (elements with position:absolute don't add height to the body). Adding height 100% to the body would do the trick, but its simply better to attach the event to the document instead.

/José Jeria

nzakas April 30th, 2006 10:02 AM

Jose,

I've updated the code per your suggestion. It can be downloaded at http://www.nczonline.net/downloads/.

Nicholas C. Zakas
Author, Professional JavaScript for Web Developers (ISBN 0764579088)
http://www.nczonline.net/

alkazam July 28th, 2006 04:05 AM

Nicholas ,

Your code is not compatible with FireFox browser. :(



All times are GMT -4. The time now is 06:25 PM.

Powered by vBulletin®
Copyright ©2000 - 2019, Jelsoft Enterprises Ltd.
© 2013 John Wiley & Sons, Inc.