Elastic menu — OZONE Asylum, home of the Mad Scientists

DHTML/Javascript

This page's ID: 30033

Edit Post

Who can edit a post?	The poster and administrators may edit a post. The poster can only edit it for a short while after the initial post.

Your User Name:
Your Password:
Login Options:	Remember Me On This Computer

Your Text: Insert Slimies » Insert UBB Code » Close Last Tag \| All Tags UBB Help	Okay, it looks shiny but I'm concerned about a few things :[ulist]* hovering the highlighted item after leaving the menu makes the items wobble again * you should use a [i]UL LI A #text [/i]for the markup of the menu/navigation. That what navigations are : a list of links. * I hope you'll overload the [i]window.open( this.href, '_blank' ) [/i]by an "AJAX" call. People hate popups. * moot point, but speaking of "AJAX", the [i]loadpage()[/i] event handler should also check for a status code [b]0[/b] in case the content is cached ( I know it's no gonna happen in your case ) * bad browsers such as IE6, will fire an HTTP request for each background image swap. Replace them by CSS sprites. Changing the background position is fine. * you should not attach a mouseout and mouseover event handler on each and every navigation item but just once on the div#menu . This is a bajillion times more efficient and elegant than creating an 2 anonymous functions and event handlers for each navigation item !!! * you should really stay away of [i]setTimeout( [b]"someCode"[/b], delay )[/i] and similar calls. These create a new JavaScript context to parse [b]"someCode"[/b]. It costs memory and CPU time. Prefer [i]setTimeout( [b]aFunction[/b], delay )[/i] * limit the number of [i]setTimeout( foo, delay )[/i]. Browsers are not multithreaded and allocate time to the JS engine every X ms ( 10-20 on desktop ). Firing many [i]setTimeout( foo, delay )[/i] will produce a burst of CPU usage. * following what I just mentioned, I must say that the [i]fadeIn( foo )[/i] method is gonna kill any slow-ish machine/device. It's crazy, I count [b]98 !!![/b] [i]setTimeout( [b]"someCode"[/b], delay )[/i] + of course 2 more fired by [i]fadeOut( foo )[/i]. This is crazy. Animations should NEVER be done with a bajillion of [i]setTimeout( [b]"someCode"[/b], delay )[/i] or [i]setTimeout( [b]aFunction[/b], delay )[/i]. Firing many timers is gonna hurt the memory and performance. And using hardcoded delays makes the duration of the animations depend on a specific speed. This is doomed to ruin the user experience on any machine/device significantly slower/faster than that of the developer. Always prefer having a single [i]setInterval( [b]updateAnimation[/b], delay )[/i] and define your animations' duration in ms. This way, they will run at the same speed on any machine/device.[/ulist] :p I guess that's enough for now. I should really jump in the shower and head to work. From what the code I saw, I think you'd benefit from reading things by John Resig, Chris Heilmann & co. These guys really know their sh*t. HTH [url=http://www.p01.org/][sigrotate][img]http://poi.ribbon.free.fr/files/p01_ozoneasylum_sig_love.gif[/img]\|[img]http://poi.ribbon.free.fr/files/p01_ozoneasylum_sig_love_small.gif[/img]\|[img]http://poi.ribbon.free.fr/files/p01_ozoneasylum_sig_charly.gif[/img]\|[img]http://poi.ribbon.free.fr/files/p01_ozoneasylum_sig_dk.gif[/img]\|[img]http://poi.ribbon.free.fr/files/p01_ozoneasylum_sig_reason.gif[/img]\|[img]http://poi.ribbon.free.fr/files/p01_ozoneasylum_sig_galaxy.gif[/img]\|[img]http://poi.ribbon.free.fr/files/p01_ozoneasylum_sig_neon88x31.gif[/img]\|[img]http://poi.ribbon.free.fr/files/p01_ozoneasylum_sig_teapot.png[/img][/sigrotate][/url] Loading...
Options:	Enable Slimies Enable Linkwords

« Backwards — Onwards »

Show Forum Drop Down Menu