[AnyLink CSS Menu v2.3] Position problem

[DaTongue]

1) Script Title: AnyLink CSS Menu v2.3

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

3) Describe problem: Hi everybody,

I have a problem with the position of this script.

I'm using this menu twice in this page: http://www.creation-website.net/validation/arc/index.html

First time on the menu above the slideshow.

Second time below the slideshow.

It's working successfully on the first menu.

But on the second one, the position of the submenu depends of the scrollbar. If we are on the middle of the page it's ok (like in the Screenshot 1), but if we are on the bottom of the page, it's not (like in the Screenshot 2).


Screenshot 1:
http://www.creation-website.net/validation/arc/screenshot.jpg

Screenshot 2:
http://www.creation-website.net/validation/arc/screenshot2.jpg

Thank you very much for your time and your help!

Gregg

[DaTongue]

I think I understand my problem.

The submenu's position is different if there is not enough space on the screen. The position depends of the resolution of our navigator.

Is it possible to delete this function? Even if we have to scroll, I would like the submenu appearance always on the same position.

On the Script page, here is the name of this functionnality I would like to suppress: "Menu repositions itself if too close to any of the window's four edges to avoid being obscured."

Here is my code:



<div id="nav">
<a href="" class="anchorclass" rel="submenu1" id="hebergement"></a><a href="" class="anchorclass" rel="submenu2" id="ski"></a><a href="" class="anchorclass" rel="submenu3" id="loisirs"></a><a href="" class="anchorclass" rel="submenu4" id="famille"></a><a href="" class="anchorclass" rel="submenu5" id="station"></a><a href="" class="anchorclass" rel="submenu6" id="love"></a>
</div>

.anylinkcss{
position: absolute;
left: 0;
top: 0;
visibility: hidden;
background:transparent url(../images/sous-menu_bg.png) no-repeat left top;
font-size:0.8em;
color:#28576d;
line-height: 18px;
z-index: 100;
width: 615px;
height:115px;
}

.anylinkcss .column:first-child{
width: 140px;
background:transparent url(../images/pix.gif) no-repeat left top;
float: left;
margin:20px 0px 0px 20px;
padding:0;
}
.anylinkcss .column{
width: 160px;
background:transparent url(../images/separateur_sous-menu.png) no-repeat left top;
float: left;
margin:20px 0px 0px 10px;
padding:0;
padding-left:10px;
}

.anylinkcss .column ul{
margin: 0;
padding: 0;
list-style-type: none;
}

.anylinkcss li{
padding-bottom: 3px;
}
.anylinkcss li a{
font-size:1em;
color:#28576d;
text-decoration:none;
font-weight:bold;
}
.anylinkcss li a:hover{
font-size:1em;
color:#28576d;
text-decoration:underline;
font-weight:bold;
}

#submenu1{margin:0px 0px 0px 133px;}
#submenu2{margin:0px 0px 0px -25px;}
#submenu3{margin:0px 0px 0px -131px;}
#submenu4{margin:0px 0px 0px -300px;}
#submenu5{margin:0px 0px 0px -400px;}
#submenu6{margin:0px 0px 0px -498px;}




Thanks in advance for your help...