Question

http://designobvio.us/DoUs/directPro.html

jQuery Script

$(window).scroll(function() {
$('#nav').css('top', $(this).scrollTop() + "px");
});

HTML

<nav id="nav" class="grid_2">    
  <ul>
    <li><a href="#"><span>↗</span>Portfolio</a></li>
    <li><a href="#">Blog</a></li>

    <li><a href="#">About Me</a></li>
    <li>
        <ul class="secondaryUL">
           <li><a href="#">business</a></li>
           <li><a href="#">skills</a></li>
           <li><a href="#">service</a></li>
        </ul>

    </li>
    <li><a href="#">me</a></li>
    <li><a href="#">contact</a></li>
 </ul>    
</nav>

any clue on how to fix the flicker in IE and Chrome.. It looks fine in FF, dont even have Safari to test on.
http://designobvio.us/DoUs/directPro.html

I’m useing jQuery so I dont have to adjust all my css to do this one tweak. anyone have any ideas on how to accomplish this effiencently and symantically clean?

Answer 1

I think there’s no way it can be done satisfactorily in javascript. You’ll always get a flicker in most browsers.
What i did the last time i tried it, was using position:fixed.