asmith Posted May 22, 2008 Share Posted May 22, 2008 hey guys this code is a simple drop down menu. the problem i have with it is, I can't place the menu exactly under the link. because of the different screen resulation. the position is absolute. in different resolution the menu place moves to right or left. i wanted to know how can i fix it, for example it goes always under its link? (i've tried making it without absolute position, but then it placed the menu between the page element and moved the bottom contents more down to make room for the menu. ) <head> <script language="javascript"> function showLinks() { document.getElementById('myLinks').style.display='block'; } function hideLinks() { document.getElementById('myLinks').style.display='none'; } </script> </head> <body> top content<br /> top content<br /> top content<br /> top content<br /> <div id="myLinks1" onmouseover="showLinks()"> <a href="6.gif" onmouseover="showLinks()" onmouseout="hideLinks()">navigate cursor here!</a> <div color="yellow" id="myLinks" style="display:none;position:absolute;top:100px;left:500px;z-index:1000;border:1px black solid;background-color:red;color:white;" onmouseover="showLinks()" onmouseout="hideLinks()"> <a href="http://www.google.com">Google</a><br /> <a href="http://www.yahoo.com">Yahoo</a><br /> <a href="http://www.msn.com">MSN</a> </div> </div> <div id="test"> Other contents of page<br /> Other contents of page<br />Other contents of page<br />Other contents of page<br />Other contents of page<br />Other contents of page<br /> </div> </body> Quote Link to comment Share on other sites More sharing options...
wrongmove18 Posted May 22, 2008 Share Posted May 22, 2008 remove the top and left style Quote Link to comment Share on other sites More sharing options...
asmith Posted May 22, 2008 Author Share Posted May 22, 2008 i want to have that menu position under control. removing those do not gie me my desire place. Quote Link to comment Share on other sites More sharing options...
KevinM1 Posted May 22, 2008 Share Posted May 22, 2008 Question: Is the rest of your site fixed-width? Quote Link to comment Share on other sites More sharing options...
asmith Posted May 22, 2008 Author Share Posted May 22, 2008 i was wondering about both ways, fix-width and non fix-width. But lets say it is for example 900 px. Quote Link to comment Share on other sites More sharing options...
KevinM1 Posted May 22, 2008 Share Posted May 22, 2008 i was wondering about both ways, fix-width and non fix-width. But lets say it is for example 900 px. Well, fixed-width would probably be the easiest way to fix it, as you wouldn't have to worry about screen resolution (for the most part). That left/right movement you've been noticing should go away, as the containing block will remain the same size. In other words, if you have a site with a width of 900px, and you tell the drop-down to be top: 100px and left: 500px, it will position itself relative to the 900px, not the browser window. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.