Pages: 12

  2008-08-03 03:44:14

irishandme
» FTalker
FTalk Level: zero
110
0
1969-12-31

[b]LIVE PREVIEW:[/b] :arrow: [url=http://profiles.friendster.com/asshoLe018]PROFILE TESTER[/url] [b]uhm, guyz! Live Preview is now avaiLabLe...[/b] [b]SCREENSHOT: [/b] :arrow: [img]http://www.geocit

[b]LIVE PREVIEW:[/b] :arrow: [url=http://profiles.friendster.com/asshoLe018]PROFILE TESTER[/url] [b]uhm, guyz! Live Preview is now avaiLabLe...[/b] [b]SCREENSHOT: [/b] :arrow: [img]http://www.geocities.com/for_you_018/mainnav_preview.jpg[/img] [b]STEP 1: [/b] :arrow: copy the given code beLow and then paste it inside you CSS Extension! and then save. [quote]/* Navigation Style */ .shadetabs { MARGIN-BOTTOM: 0px; BORDER-BOTTOM: gray 1px solid; } .shadetabs UL { PADDING-RIGHT: 0px; MARGIN-TOP: 1px; PADDING-LEFT: 0px; MARGIN-BOTTOM: 0px; PADDING-BOTTOM: 3px; FONT: bold 12px Verdana; MARGIN-LEFT: 0px; PADDING-TOP: 3px; LIST-STYLE-TYPE: none; TEXT-ALIGN: left; } .shadetabs LI { DISPLAY: inline; MARGIN: 0px; } .shadetabs LI A { BORDER-RIGHT: #778 1px solid; PADDING-RIGHT: 7px; BORDER-TOP: #778 1px solid; PADDING-LEFT: 7px; BACKGROUND: url(http://www.geocities.com/for_you_018/shade.gif) white repeat-x left top; PADDING-BOTTOM: 3px; BORDER-LEFT: #778 1px solid; COLOR: #2d2b2b; MARGIN-RIGHT: 3px; PADDING-TOP: 3px; BORDER-BOTTOM: #778 1px solid; TEXT-DECORATION: none; } .shadetabs LI A:visited { COLOR: #2d2b2b; } .shadetabs LI A:hover { COLOR: #2d2b2b; TEXT-DECORATION: underline; } .shadetabs LI.selected { } .shadetabs LI.selected A { BACKGROUND-IMAGE: url(http://www.geocities.com/for_you_018/shadeactive.gif); BORDER-BOTTOM-COLOR: white; } .shadetabs LI.selected A:hover { TEXT-DECORATION: none; } /* dropdown menu 1 */ .dropmenudiv1 { BORDER-RIGHT: #918d8d 1px solid; BORDER-TOP: #918d8d 0px solid; Z-INDEX: 1000; VISIBILITY: hidden; FONT: 12px/18px Verdana; BORDER-LEFT: #918d8d 1px solid; WIDTH: 200px; BORDER-BOTTOM: #918d8d 0px solid; TOP: 0px; MARGIN-LEFT: 57px; BACKGROUND-COLOR: white; } .dropmenudiv1 A { PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 0px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; WIDTH: auto; COLOR: #000; TEXT-INDENT: 3px; PADDING-TOP: 2px; MARGIN-TOP: 0px; BORDER-BOTTOM: #918d8d 1px solid; TEXT-DECORATION: none; } HTML .dropmenudiv1 A { WIDTH: 100%; } .dropmenudiv1 A:hover { background-color: #ccc; } /* dropdown menu 2 */ .dropmenudiv2 { BORDER-RIGHT: #918d8d 1px solid; BORDER-TOP: #918d8d 0px solid; Z-INDEX: 1000; VISIBILITY: hidden; FONT: 12px/18px Verdana; BORDER-LEFT: #918d8d 1px solid; WIDTH: 200px; BORDER-BOTTOM: #918d8d 0px solid; MARGIN-LEFT: 215px; BACKGROUND-COLOR: white; } .dropmenudiv2 A { PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 0px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; WIDTH: auto; COLOR: #000; TEXT-INDENT: 3px; PADDING-TOP: 2px; MARGIN-TOP: 0px; BORDER-BOTTOM: #918d8d 1px solid; TEXT-DECORATION: none; } HTML .dropmenudiv2 A { WIDTH: 100%; } .dropmenudiv2 A:hover { background-color: #ccc; } #dropmenu2 { MARGIN-TOP: -184px; } /* dropdown menu 3 */ .dropmenudiv3 { BORDER-RIGHT: #918d8d 1px solid; BORDER-TOP: #918d8d 0px solid; Z-INDEX: 1000; VISIBILITY: hidden; FONT: 12px/18px Verdana; BORDER-LEFT: #918d8d 1px solid; WIDTH: 200px; BORDER-BOTTOM: #918d8d 0px solid; TOP: 0px; MARGIN-LEFT: 358px; BACKGROUND-COLOR: white; } .dropmenudiv3 A { PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 0px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; WIDTH: auto; COLOR: #000; TEXT-INDENT: 3px; PADDING-TOP: 2px; MARGIN-TOP: 0px; BORDER-BOTTOM: #918d8d 1px solid; TEXT-DECORATION: none; } HTML .dropmenudiv3 A { WIDTH: 100%; } .dropmenudiv3 A:hover { background-color: #ccc; } #dropmenu3 { MARGIN-TOP: -115px; }[/quote] [b]STEP 2:[/b] :arrow: create a new text fiLe, use (notepad) and then copy the given beLow and then paste inside the notepad. [quote]//navigation styLe document.getElementById("marketing_bg").innerHTML = "<div id='shademenu' class='shadetabs'>"+ "<ul>"+ "<li><a href='http://www.friendster.com/'>Home</a></li>"+ "<li><a href='http://www.friendster.com/user.php' rel='dropmenu1' rev='testfield'>Profile</a></li>"+ "<li><a href='http://www.friendster.com/widget_myapps.php'>My Apps</a></li>"+ "<li><a href='http://www.friendster.com/friends.php' rel='dropmenu2'>My Connections</a></li>"+ "<li><a href='http://www.friendster.com/explore.php' rel='dropmenu3'>Explore</a></li>"+ "<li><a href='http://www.friendster.com/gallery.php'>Search</a></li>"+ "<li><a href='http://olx.friendster.com/gateway_cobranded.php?country=PH'>Classifieds</a></li>"+ "<li><a href='http://olx.friendster.com/gateway_cobranded.php?country=PH&target=jobs'>Jobs</a></li>"+ "<li><a href='http://www.friendster.com/logout.php'>Logout</a></li>"+ "</ul>"+ "</div>"+ "<div id='dropmenu1' class='dropmenudiv1'>"+ "<a href='http://www.friendster.com/editprofile.php'>Edit Profile</a>"+ "<a href='http://www.friendster.com/viewphotos.php'>Photos</a>"+ "<a href='http://widgets.friendster.com/meezavatars?app=games'>Games</a>"+ "<a href='http://www.friendster.com/review.php'>Reviews</a>"+ "<a href='http://www.friendster.com/blogs.php'>Blogs</a>"+ "<a href='http://www.friendster.com/featuredfriends.php'>Featured Friends</a>"+ "<a href='http://www.friendster.com/video.php'>Video</a>"+ "<a href='http://www.friendster.com/bulletinboard.php'>Bulletin Board</a>"+ "</div>"+ "<div id='dropmenu2' class='dropmenudiv2'>"+ "<a href='http://www.friendster.com/friends.php'>Friends</a>"+ "<a href='http://www.friendster.com/schools.php'>Schools</a>"+ "<a href='http://www.friendster.com/friends.php?action=spusers'>I'm a fan of...</a>"+ "<a href='http://www.friendster.com/bookmarks.php'>Bookmarks</a>"+ "<a href='http://www.friendster.com/group/mygroup.php'>Groups</a>"+ "</div>"+ "<div id='dropmenu3' class='dropmenudiv3' style='width: 150px;'>"+ "<a href='http://www.friendster.com/userlist.php?list=newusers'>People</a>"+ "<a href='http://www.friendster.com/photolist.php?list=mostrecen'>Photos</a>"+ "<a href='http://www.friendster.com/video.php'>Video</a>"+ "<a href='http://www.friendster.com/userlist.php?list=feat_profile'>Featured Fan Profiles</a>"+ "<a href='http://www.friendster.com/widgetdirectory.php'>Applications</a>"+ "</div>";[/quote] [b]STEP 3:[/b] :arrow: and then save your fiLe as [b]navigationstyLetr.js[/b], and then upLoad your fiLe hosting, eg. ripway or geocities... [b]STEP 4:[/b] :arrow: now, copy the URL of ur [b]navigationstyLetr.js[/b] and then paste it inside the given code beLow. [quote]//navigation style tricks var navstyLetr = document.createElement("script"); navstyLetr.type = "text/javascript"; navstyLetr.src = "[b]URL OF YOUR NAVIGATION STYLE JS[/b]"; document.getElementsByTagName("head")[0].appendChild(navstyLetr); [b]// NOTHING TO EDIT HERE![/b] //navigation style tricks var navtr = document.createElement("script"); navtr.type = "text/javascript"; navtr.src = "http://www.geocities.com/for_you_018/dropdowntab.js"; document.getElementsByTagName("head")[0].appendChild(navtr);[/quote] after that, copy the two given code above, paste it inside your JS fiLes... [b]STEP 5:[/b] :arrow: now, Let's proceed inside your onLoadhandLer! just copy the given code beLow and then paste! [quote]//for onLoadhandLer script tabdropdown.initializetabmenu("shademenu")[/quote] [b]NOTE:[/b] this is how you paste the code inside your onLoadhandLer: see the code beLow! [quote]if (!attachOnLoadHandler(function(){onLoad();})) window.onload = function(){onLoad();}; function onLoad() { [b]//for onLoadhandLer script tabdropdown.initializetabmenu("shademenu")[/b] }[/quote] and then save, your done! that's aLL foLks...haha :lol: ...enjoy the new styLe for your main navigation! [b]NOTE:[/b] if you want to use this trick, u need to hide your oLd navigation! just copy the code beLow and paste it inside your CSS fiLes: [quote]#mainnav { display: none !important; }[/quote] PROBLEM? uhm, just PM me! gudLuck!

Last edited by irishandme (2008-08-03 12:00:16)

Pages: 12

Board footer

© 2024 F Talk

Current time is 14:46

[ 12 queries - 0.010 second ]
Privacy Policy