By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
435,594 Members | 3,017 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 435,594 IT Pros & Developers. It's quick & easy.

I need help customizing a Floating Menu to go through a table only

P: 1
I am working in a floting menu for a website, I found this cool script, it works great, but I need to limit the movement of the menu to a table area, right now it goes up and down through the whole body, is there a quick fix for this? please help.

Thanks.



Expand|Select|Wrap|Line Numbers
  1. <script>
  2. if (!document.layers)
  3. document.write('<div id="divStayTopLeft" style="position:absolute">')
  4. </script>
  5.  
  6. </p><layer id="divStayTopLeft">
  7.  
  8. <!--EDIT BELOW CODE TO YOUR OWN MENU-->
  9. <table border="1" width="110" cellspacing="0" cellpadding="0">
  10.   <tr>
  11.     <td width="100%" bgcolor="#CCCCCC"> 
  12.       <p align="center"><b><font size="4" face="Arial Narrow, Arial">Quick Links</font></b></td>
  13.   </tr>
  14.   <tr>
  15.     <td width="100%" bgcolor="#FFFFFF"> <p align="left"> <img src="images/s" width="5" height="1"><a href="http://www.dynamicdrive.com"><font size="3" face="Arial Narrow, Arial">Contact 
  16.         Us</font></a><font size="3" face="Arial Narrow, Arial"><br>
  17.         <img src="images/s" width="5" height="1"><a href="http://www.dynamicdrive.com/new.htm">How To Pay</a><br>
  18.         <img src="images/s" width="5" height="1"><a href="http://www.dynamicdrive.com/hot.htm">About Us</a><br>
  19.         <img src="images/s" width="5" height="1"><a href="http://www.dynamicdrive.com/faqs.htm">FAQs</a><br>
  20.         <img src="images/s" width="5" height="1"><a href="http://www.dynamicdrive.com/morezone/">About Shipping</a></font></td>
  21.   </tr>
  22. </table>
  23. <!--END OF EDIT-->
  24.  
  25. </layer>
  26.  
  27.  
  28. <script type="text/javascript">
  29.  
  30. /*
  31. Floating Menu script-  Roy Whittle (http://www.javascript-fx.com/)
  32. Script featured on/available at http://www.dynamicdrive.com/
  33. This notice must stay intact for use
  34. */
  35.  
  36. //Enter "frombottom" or "fromtop"
  37. var verticalpos="frombottom"
  38.  
  39. if (!document.layers)
  40. document.write('</div>')
  41.  
  42. function JSFX_FloatTopDiv()
  43. {
  44.     var startX = 3,
  45.     startY = 150;
  46.     var ns = (navigator.appName.indexOf("Netscape") != -1);
  47.     var d = document;
  48.     function ml(id)
  49.     {
  50.         var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
  51.         if(d.layers)el.style=el;
  52.         el.sP=function(x,y){this.style.left=x;this.style.top=y;};
  53.         el.x = startX;
  54.         if (verticalpos=="fromtop")
  55.         el.y = startY;
  56.         else{
  57.         el.y = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
  58.         el.y -= startY;
  59.         }
  60.         return el;
  61.     }
  62.     window.stayTopLeft=function()
  63.     {
  64.         if (verticalpos=="fromtop"){
  65.         var pY = ns ? pageYOffset : document.body.scrollTop;
  66.         ftlObj.y += (pY + startY - ftlObj.y)/8;
  67.         }
  68.         else{
  69.         var pY = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
  70.         ftlObj.y += (pY - startY - ftlObj.y)/8;
  71.         }
  72.         ftlObj.sP(ftlObj.x, ftlObj.y);
  73.         setTimeout("stayTopLeft()", 10);
  74.     }
  75.     ftlObj = ml("divStayTopLeft");
  76.     stayTopLeft();
  77. }
  78. JSFX_FloatTopDiv();
  79. </script>
Jan 19 '08 #1
Share this Question
Share on Google+
2 Replies


Expert 10K+
P: 11,448
That is Javascript you're showing us in a Java forum. Those two languages have
nothing much in common despite their name. I'll move your question over to the
Javascript forum.

kind regards,

Jos (mod)
Jan 19 '08 #2

acoder
Expert Mod 15k+
P: 16,027
I am working in a floting menu for a website, I found this cool script, it works great, but I need to limit the movement of the menu to a table area, right now it goes up and down through the whole body, is there a quick fix for this? please help.
Get the dimensions of the table (the top/left and width/height properties). From these, you can determine the 'bounding box' and where the menu should stay.
Jan 21 '08 #3

Post your reply

Sign in to post your reply or Sign up for a free account.