469,336 Members | 6,193 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,336 developers. It's quick & easy.

How do I fix this dynamic menu ?

290 100+
Hi I have a dynamic menu on my site and it uses
javascript to make slide up and down the page.

I think its pretty cool but it seems that it works independently of the
page so if you try and reduce the width of the window, it starts getting messed up.

Have a look here and you will see what I mean:

my website

One other thing I don't like is that it forces the window to 100% each
time you click a link, I am sure that will annoy people.

Is there an easy way to stop the central column from "crashing into" the menu when the window width is reduced ?

And how do I stop this 100% window without messing the page up ?

Thanks for any advice.

The menu code is here :

(there are a few lines of php but the main part is all javascript)



Expand|Select|Wrap|Line Numbers
  1.  
  2. /*
  3. * Next display the menu.
  4. *
  5. *
  6. */
  7. $start = 0;
  8. $last = 20;
  9.  
  10.         $sql = "SELECT sc_name, user_id FROM clients
  11.         WHERE confirm = 'y'  
  12.       AND type = 'E'
  13.       ORDER BY lig_pos DESC LIMIT $start,$last";             
  14.  
  15.         $result = mysql_query($sql)
  16.          or die ("Could not execute STARTER FEATURE query.");
  17.  
  18.         while ($row = mysql_fetch_array($result, MYSQL_ASSOC))
  19.             {
  20.             $Links[] = $row;
  21.             }
  22.  
  23.  
  24. //--> Output data.
  25.  
  26. echo '
  27. <div id="divStayTopLeft" style="position:absolute">
  28. <div class="menuH">Top Experts</div>
  29. <ul class="categorylinks">';
  30.  
  31. foreach ($Links as $Link){
  32. $the_link = str_replace(" ","%20",$Link['sc_name']);
  33. echo "<li><a href=\"/$the_link/internet_marketing/expert/guru_{$Link['user_id']}\">&nbsp;{$Link['sc_name']}</a></li>";
  34. }
  35. echo '</ul>';  
  36. ?>            
  37.  
  38. </div>
  39. <script type="text/javascript">
  40.  
  41.  
  42.  window.moveTo(0,0);
  43.  window.resizeTo(screen.width,screen.height);
  44.  
  45. /*
  46. Floating Menu script-  Roy Whittle (http://www.javascript-fx.com/)
  47. Script featured on/available at http://www.dynamicdrive.com/
  48. This notice must stay intact for use
  49. */
  50.  
  51. //Enter "frombottom" or "fromtop"
  52. var verticalpos="frombottom"
  53.  
  54. document.write('<\/div>')
  55.  
  56. function JSFX_FloatTopDiv()
  57. {
  58.     var startX = 20,
  59.     startY = 600;
  60.     var ns = (navigator.appName.indexOf("Netscape") != -1);
  61.     var d = document;
  62.     function ml(id)
  63.     {
  64.         var el=d.getElementById?d.getElementById(id):d.all?d.all[id]:d.layers[id];
  65.         if(d.layers)el.style=el;
  66.         el.sP=function(x,y){this.style.left=x;this.style.top=y;};
  67.         el.x = startX;
  68.         if (verticalpos=="fromtop")
  69.         el.y = startY;
  70.         else{
  71.         el.y = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
  72.         el.y -= startY;
  73.         }
  74.         return el;
  75.     }
  76.     window.stayTopLeft=function()
  77.     {
  78.         if (verticalpos=="fromtop"){
  79.         var pY = ns ? pageYOffset : document.body.scrollTop;
  80.         ftlObj.y += (pY + startY - ftlObj.y)/8;
  81.         }
  82.         else{
  83.         var pY = ns ? pageYOffset + innerHeight : document.body.scrollTop + document.body.clientHeight;
  84.         ftlObj.y += (pY - startY - ftlObj.y)/8;
  85.         }
  86.         ftlObj.sP(ftlObj.x, ftlObj.y);
  87.         setTimeout("stayTopLeft()", 10);
  88.     }
  89.     ftlObj = ml("divStayTopLeft");
  90.     stayTopLeft();
  91. }
  92. JSFX_FloatTopDiv();
  93. </script>
  94.  
  95.  
Feb 2 '09 #1
1 1088
acoder
16,027 Expert Mod 8TB
The 100% problem is caused by lines 42-43. Remove them.

As for the script, it's a bit of mix-mash of old code/browser detection. You can use position: fixed instead. It works in most modern browsers. It doesn't work in IE6 though, but you can use this fix.
Feb 3 '09 #2

Post your reply

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

Similar topics

4 posts views Thread by Stromboli | last post: by
1 post views Thread by Nathan Bloomfield | last post: by
1 post views Thread by biela | last post: by
2 posts views Thread by vikram | last post: by
19 posts views Thread by mart2006 | last post: by
3 posts views Thread by RahimAsif | last post: by
reply views Thread by benfly08 | last post: by
10 posts views Thread by mart2006 | last post: by
1 post views Thread by CARIGAR | last post: by
reply views Thread by suresh191 | last post: by
reply views Thread by Marylou17 | last post: by
1 post views Thread by Marylou17 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.