Wenying

1 | Shalini

May 19th, 2008 at 6:46 am

Awesome job…thanks a lot! It truly helps us lesser mortals with little or no knowledge of javascript
But i’m having a problem with aligning the slider and the text in the menu. (in IE 7)
css –>
.menu{
position:relative;
background: url(”yellow.gif”) repeat-x; */yellow.gif is 1×100 px/*
width:100%;
height:100px;
}

.menu ul {list-style:none; z-index:10; position:absolute; z-index:100; padding:7px }
.menu li {float:left}

.menu a{
font-size:12px;
font-family: arial, helvetica, sans-serif;
text-transform: uppercase;
font-weight: bold;
text-align:left;
}

.menu a, .menu a:active, .menu a:visited, .menu a:hover {
text-decoration:none;
color:#FFF;
padding:6px;
}

#slide {position:absolute; height:30px; background:#89957a; opacity:0.4;
filter:alpha(opacity=40); z-index:10}

markup–>
<div class=”menu”>
<ul id=”menu”>
<li id=”current”><a href=”#” >home</a></li>
<li><a href=”#”>pictures</a></li>
<li><a href=”#”>architectures</a></li>
<li><a href=”#”>my account</a></li>
<li><a href=”#”>how to</a></li>
</ul>
<div id=”slide”></div>

</div>

2 | Michael

May 19th, 2008 at 7:58 am

@dreedenator - The function I referenced is an example of wrapping multiple onload events into one global onload function call.

@surelock - Looks the same in IE7 and FF to me so not sure what end result you are looking for. Email me if you like michael@leigeber.com.

3 | surelock

May 19th, 2008 at 2:14 pm

This is a great lil script, but I am having trouble getting it to work in IE (6&7), any suggestions? Here is the site I am trying to get it to work on http://www.back40internetinnovators.com/thepuzzleboy/index3.htm It works fine in FF and Opera but it throws the text and slider to the center of the page, and does not align them properly. I realize that this is probably my fault due to an error I made somewhere, but I have had no luck tracking it down.

Thanks much for any assistance or suggestions you may be able to provide.

4 | gratefull

May 19th, 2008 at 5:12 pm

Gratefully appreciated.

5 | dreedenator

May 19th, 2008 at 10:06 pm

@windy: I got my trans png working on ie6 with the htc hack i was using. Just had to initialize it by adding the li in the style section. Now however only the left side works the right corner is gone!

6 | dreedenator

May 20th, 2008 at 2:56 am

@windy I have the same problem I want to use a trans png and can’t get it to work, i’m using this png hack:http://www.twinhelix.com/css/iepngfix/

@michael: what is this and how to implement it? :
window.onload = function(){
function1();
function2();
}

7 | maarten

May 20th, 2008 at 3:33 am

I put it online check result http://www.extrasaus.nl thnx again

8 | maarten

May 20th, 2008 at 9:11 am

ok, I moved the onload event from the body to the image gallery js script, this works perfectly!

btw awesome scripts you’ve put online for all of us! thnx