I’d like to add a little finesse to [url=”apps.cpe.ky.gov/temp_docs/prototypes/KYVC/kyvc5/index.htm”]this design draft
I’ve experimented with
– css/animated .gif backgrounds, but IE6 reloads the .gif on each <li> hover
– css/opacity backgrounds, but the nested <li> text is also affected by the container opacity setting
So, I’m thinking that this has to occur through javascript. What should I do to the standard suckerfish js to create this effect? (Note: I did search but only found PHP solutions, which I can’t use.) I played around with setInterval, but I couldn’t get it to work in IE6 (although that may have to do with my js skills rather than the function). (I assume, too, that I’d need to take out the li:hover stuff from the CSS so Fx will be reliant on this also.)
[code]
<script type=”text/javascript”><!–//–><![CDATA[//><!–
sfHover = function() {
var sfEls = document.getElementById(“Nav”).getElementsByTagName(“LI”);
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=” sfhover”;
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(” sfhover\b”), “”);
}
}
}
if (window.attachEvent) window.attachEvent(“onload”, sfHover);
//–><!]]></script>
[I]Note: I am still working on this document, so some things might look a little weird, however the changes should not affect the <ul> in question.
KDLA