Hello, I have been playing with jQuery for the last month or so and was wondering if some one could help me out with a few issues I've been having...
The test page is http://www.sjrmc.org/Scripts/jquery.ui-1.6b/demos/functional/Untitled-1.html The issues is the... if when the page loads and some one closes the top boxes the boxes below move up... that is a problem when you drag the bottom one close to the top then close the box the started off above it. It "last" box the was drug to the top now moves up past the page top making impossible to move it... hope that is clear... The second issue is for some odd reason I can't get the boxes to respect the size of the i-frame I put in... I think that is it although there is one more thing that I know I need to work on... in the script... start: function() { $(this).css("z- index", ++globalIndex); }, is repeated many times... but all tries to it as a global function has failed any help there would be great to... thank you and have a great day... jeremyBass the jQuery test script (the long goal is to make a dynamic version were the boxes are created on the fly): <script type="text/javascript"> $(function(){ var globalIndex = 1; $("#simpleDiv").resizable({start: function() { $(this).css("z-index", + +globalIndex); }, handles: "all", autoHide: true, transparent: true, helper: "proxy" , ghost: true }).draggable({start: function() { $ (this).css("z-index", ++globalIndex); }, handle: "div" }).click(function() { $(this).css("z-index", ++globalIndex); }); $("#simpleDiv2").resizable({start: function() { $(this).css("z-index", ++globalIndex); }, handles: "all", autoHide: true, transparent: true, helper: "proxy" , ghost: true }).draggable({start: function() { $ (this).css("z-index", ++globalIndex); }, handle: "div" }).click(function() { $(this).css("z-index", ++globalIndex); }); $("#simpleDiv3").resizable({start: function() { $(this).css("z-index", ++globalIndex); }, handles: "all", autoHide: true, transparent: true, helper: "proxy" , ghost: true }).draggable({start: function() { $ (this).css("z-index", ++globalIndex); }, handle: "div" }).click(function() { $(this).css("z-index", ++globalIndex); }); $("#doScale").click(function() { $(".scalefx").toggle("scale", {}, 200).remove(210); }); $("#doScale2").click(function() { $(".scalefx2").toggle("scale", {}, 200).remove(210); }); $("#doScale3").click(function() { $(".scalefx3").toggle("scale", {}, 200).remove(210); }); }); $(function() { var $frame = $('<iframe style="width:100%; height:100%;">'); $('#replaceME').html( $frame ); setTimeout( function() { var doc = $frame[0].contentWindow.document; var $body = $('body',doc); $body.html('<h1>Test</h1><h1>Test</h1><h1>Test</ h1><h1>Test</h1><h1>Test</h1>'); }, 1 ); }); </script>
