Any Link Drop Down Menu position question

[jamacfarlane]

1) Script Title: Any Link Drop Down Menu

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex1/anylinkcss.htm

3) Describe problem: First, I love this script and have used it several times. What I would like to do at this point is position the drop down exactly where I want it to show up. The page I am using it on is this:

http://www.aristorialane.com/index-new.html

If you scroll over the menu item Our Painters the drop down displays exactly how I want it to except I would like it aligned with the left side of the browser so that basically the drop down covers the whole page content. How can I specify that I want the position to be aligned with the left side of the browser, regardless of which link is moused over? I don't know where in the code to change this.

Thanks!

[ddadmin]

Sure. Firstly, give the element on the page you wish the drop down to always be positioned relative to an ID attribute. In this case, the "Welcome" link seems to fit the bill:


<a href="http://www.aristorialane.com/index.html" id="dropmenuanchor"><div class="navOn">WELCOME</div></a>

Then, modify the script with the change in red:


function getposOffset(what, offsettype){
var what=document.getElementById('dropmenuanchor')

[jamacfarlane]

That worked great! Now one more question. Is there a way to move the text links to show up under the link that was moused over, even though the background box is anchored to the left? So the drop-down links would be displayed under the appropriate main link?

[ddadmin]

Hmm I'm not getting what you're trying to accomplish visually in my mind. More description? :)

[jamacfarlane]

Thanks for the reply! Ok, I changed the code and added the line above. So now when you mouse over the link Our Painters the drop down box is aligned to the left below Welcome, perfect. But now what I want to do is have the names of the painters show up below the Our Painters link rather than below Welcome. Same for the sculptors. Does that make sense? So the dropdown box is where I want it, but I want the drop down links directly below the link that triggers the drop down. I hope that clears it up. I appreciate your help.

[jamacfarlane]

Thanks for your help. Any ideas on my last post?

[ddadmin]

I see what you mean now. There's no real way to "double" align the menu and the menu contents differently. However, what you can do is just manually add a horizontal offset to the name of the painters, so they align to the activating link. For example:


menu1[0]='<a href="carron.html" style="margin-left: 100px">FRANCK CARRON</a>'
menu1[1]='<a href="tison.html" style="margin-left: 100px">CHRISTINE TISON</a>'

//Contents for menu 2
var menu2=new Array()
menu2[0]='<a href="transfield.html" style="margin-left: 200px">LEROY TRANSFIELD</a>'

That should do the trick.