// =================================================================== // Author: Matt Kruse // WWW: http://www.mattkruse.com/ // // NOTICE: You may use this code for any purpose, commercial or // private, without any further permission from the author. You may // remove this notice from your final code if you wish, however it is // appreciated by the author if at least my web site address is kept. // // You may *NOT* re-distribute this code in any way except through its // use. That means, you can include it in your product, or your web // site, or any other form where the code is actually being used. You // may not put the plain javascript up on your site for download or // include it in your javascript libraries for download. // If you wish to share this code with others, please just point them // to the URL instead. // Please DO NOT link directly to my .js files from your site. Copy // the files to your server and use them there. Thank you. // =================================================================== // HISTORY // ------------------------------------------------------------------ // Jan 23, 2004: Fixed problems which caused the script not to work in // some framed situations. Improved browser support. // Added easier "addHandle" implentation. // May 25, 2003: Added better event position detection, added caching // of IFRAME object references to avoid lookups. Added // 'move' cursor to handles. // May 24, 2003: Updated to fix bug with Netscape 7.x // May 23, 2003: Created /* DESCRIPTION: The purpose of this library is to allow IFRAME objects to be dragged around the screen in the same way that popup windows or draggable DIV tags are often used. Since IFRAME objects always cover form objects, this makes an ideal solution for a simulated "popup window" on a page with form objects. COMPATABILITY: Tested successfully with IE 6.x, Netscape 6.2, 7.x, and Mozilla 1.3. Since this script uses IFRAME objects and DHTML heavily, cross-browser compatability is a goal but there may be some quirks in various browser versions. USAGE: 1) Include the source file in your main document which contains the IFRAME tags. Make sure each iframe has a unique "ID" attribute. For best browser compatability, also include a "NAME" attribute in the IFRAME tag that has the same value as the "ID" attribute. 2) In the document content of each IFRAME which will be draggable, , do two things: a) Include the dragiframe.js file in the source b) add this code to the tag: onLoad="addHandle(document.getElementById('toolbar'), window);" Where 'toolbar' is the ID of an element on the page which should be the 'handle' by which the IFRAME should be dragged (like a toolbar at the top). If you want the IFRAME to be draggable by clicking anywhere in the IFRAME document, use: onLoad="addHandle(document.getElementsByTagName('body').item(0), window);" NOTE: The code will automatically look up the window.parent tree to find a parent document with draggable iframes enabled. It will attach itself to the first document it finds, allowing it to work within a framed environment. In your parent document (containing the IFRAMEs), you may set a couple of options: // Set to true to always bring the selected IFRAME to the "top" of the zIndex. // Defaults to false bringSelectedIframeToTop(true|false); // Set to true to allow IFRAME objects to be dragged off the screen. This may // make the handle be no longer reachable by the mouse, causing the IFRAME to // be stranded. // Defaults to false allowDragOffScreen(true|false); // You may manually set this variable to define the highest zIndex used in // your main document. This is used to determine what zIndex to give an IFRAME // if it is selected and "bringSelectedIframeToTop" is set to true. // Defaults to 99. DIF_highestZIndex=99; NOTES: 1) If you have defined onmousedown or onmouseup event handlers for your "handle" object in the IFRAME, they will be over-written. 2) If you have defined an onmousemove handler in either the main document or the IFRAME document, they will be over-written. 3) All