before applying JS, learn how to [url=http://theftalk.com/t14101-Apply-Javascripts-your-Friendster-Blog.html]Compile your codes[/url]

[b]Using HTML and arranging it[/b]
Here is wat a basic code will look like:
[quote]<html><head>
//css injector
//js injector
</head>
<body>
//ader js
//all div layers
</body>
</html>[/quote]
as for me, I put my js injector between the body tags...

[b]Scrolling title bar:[/b] compile wid ader js
Proceed here: [url=http://bosiljak.hr/titlemaker/]Titlemaker[/url]
In ur js, the code from the generator must b at the topmost after ur css injector..
and be sure that u dont have that css customize title bar..

[b]Rainbow links on hover[/b] compile wid ur ader js
[spoiler]<">[/spoiler]

[b]Users Online[/b] can be added n the sidebar
[spoiler][quote]<!-- Start FastOnlineUsers.com -->
[b]Users online [/b]:
<script src=http://fastonlineusers.com/online.php?d=[b]URL OF UR SITE[/b]></script>
</a><!-- End FastOnlineUsers.com -->[/quote]
you can edit users online to watever u want.. u myt wanna change it to cute/kawaii/cool online..
[/spoiler]

[b]Pop-up draggable message box[/b] Don't compile this wid ur ader js..
[b]Step 1[/b]: Add the following script to the <HEAD> section of your page:
No need to edit on this code...
[spoiler]<">[/spoiler]
[b]Step 2[/b]: Insert the below HTML code to the BOTTOM of your page, right above the </BODY> tag itself:
[spoiler][quote]<div id="showimage" style="position:absolute;[color=blue]width:250px;left:250px;top:250px[/color]">
<table border="0" [color=blue]width="250" [/color] [color=red]bgcolor="#000080" [/color]cellspacing="0" cellpadding="2">
<tr>
<td width="100%"><table border="0" width="100%" cellspacing="0" cellpadding="0"
[color=blue] height="36px">[/color]
<tr>
<td id="dragbar" style="cursor:hand; cursor:pointer" width="100%" onMousedown="initializedrag(event)"><ilayer width="100%" onSelectStart="return false"><layer width="100%" onMouseover="dragswitch=1;if (ns4) drag_dropns(showimage)" onMouseout="dragswitch=0">[color=red]<font face="Verdana"
color="#FFFFFF"><strong><small>Announcement Box</small></strong></font>[/color]</layer></ilayer></td>
<td style="cursor:hand"><a href="#" onClick="hidebox();return false"><img src="http://i27.tinypic.com/2m36175.gif" width="16px"
height="14px" border=0></a></td>
</tr>
<tr>
<td width="100%" [color=teal]bgcolor="#FFFFFF" style="padding:4px"[/color] colspan="2">
<!-- PUT YOUR CONTENT BETWEEN HERE -->
[b]
put anything here..
it'll support tags like font and color...
links and images..[/b]
<!-- END YOUR CONTENT HERE -->
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>[/quote]
[color=blue]Blue:[/color] are the variables for the whole box..
Position: juz edit the top and left to ur desired position...
then edit the width and hyt to ur own liking..
[color=red]Red:[/color] are the variables for the header..
edit the fonts and bakground to ur liking..
and change "announcemnt" to ur own desired title of the box...
[color=teal]Teal:[/color] the background for ur body
[i]i nver tried to put the the font color here.. i just put the font color at the content part..[/i]
u can try if u want to..

[b]Black:[/b] Put your content here....[/spoiler]
[b]Note:[/b] We can only fully customize the html of the banner.. the banner only.. The pop-up box and div layers are only visible in the banner... so wen using the pop up box, this code must be deleted on ur css,
[spoiler][quote]/*remove banner */
#banner-inner {
/*logo*/display:none;visibility:hidden;}
.friendster-banner {
/*logo*/display:none;}
.friendster-banner-nav-wrapper {
/*navigation*/display:none;}
.friendster-banner-nav {
/*navigation*/display:none;}[/quote]
Can u see this code too..? *[b]remove the bold part[/b]* [b]only[/b] the bold one..
[quote]/* -- Hide the Top Banner Texts (Blog Name and Catchphrase) -- */
#banner h1[b], #banner h2 [/b]{ display:none; }[/quote]
[/spoiler]
I dont write scripts.. Credits to dynamic drive and fastonlineusers...

[b]Final step: [/b] [b]Paste your html in the blog description/catchphrase..[/b]
[b]Mods...[/b] Check for errors...

[i]Still newbie with this[/i]...
Last edited by cUtiEshika (2008-04-23 18:22:46)