[u][b]Production: Class-S[/b][/u]

[i][b]New features:[/b]
-Sliding drop down
fix positioning for the screen resolution[/i]
[b]this trick is brought to you by the following url's and also the credits:[/b]
[url]http://2210media.com/dock_menu/[/url]

[url]http://www.leigeber.com/2008/04/sliding-javascript-dropdown-menu/[/url]
[b]Compatibility:[/b]
both ie and ff depending on how you edit the code.
[b]Requirements:[/b]
-you must have the navigation, it must not hide or else the trick will not properly work.
-you must have the navLang id part, it must not hide either because thats the main id that we will gonna use for this trick.
-prepare a banner to use it to the top of your profile, or if you dont want a banner you can also apply videos, frames, mp3's etc...or even just spaces using <br> tags depending on what do you want to put to the top.
-and also the [b]flo_wrapper[/b] id and the [b]flo1t[/b] id must not hide too, but you can apply [b]visibility:hidden[/b] inside the properties for that two id if you dont want to show the tables.
-and most of all, the important thing is..... patient's

[i]live preview[/i]

[url]http://profiles.friendster.com/cip6192[/url]
________________________________________________________
[b]Step one--------------------[/b]
[i]CSS properties[/i]
copy the code below and paste it in your css extension file, nothing to edit inside!
note: it will hide your mainnav totally!
<">[b]Step two------------------[/b]
copy the code below and paste it at the very last part of your js codes.
<">[b]Step three---------------[/b]
you must learn first on how to put the code that i will going to give in this step inside onloadhandler, please understand the code given below before applying to its position inside onloadhandler.
[u]this is the format[/u]
[quote]if (!attachOnLoadHandler(function(){onProfileLoad()})) window.onload = function(){onProfileLoad()};
function onProfileLoad() {
var cip = document.getElementById("navLang").innerHTML+="<div ...........................................
.........................................</div>";
[b]other codes inside onloadhandler....................[/b]
[b]other codes inside onloadhandler....................[/b]
[b]other codes inside onloadhandler....................[/b]
[b]other codes inside onloadhandler....................[/b]
toggleDown();
[b]}[/b] <--[i]end of the onloadhandler[/i][/quote]
then if you already understand the format you can now put the codes, please click the spoiler to show the code:
[spoiler]just edit the BANNER HERE part inside the code with your own banner image url
<">or if you want to put something in your own like no banner but only spaces you can change this part too in <br> tags:
[quote]<img src='BANNER HERE' border=0>[/quote]
[/spoiler]
thats it your done editing!

if you want some .png images, just visit the url below to have some icon that can be use with this trick as the icon for the mainnav:
[url]http://www.iconspedia.com/pack/all-console-143/[/url]
and if you dont want to completely hide your mainnav you can also erase this part in the css part:
<">
Last edited by cip6192 (2008-05-13 01:21:07)