Inspired by the work of [b]Mr Tobie Langel[/b] Credits: To the person above Sleepless nights Headaches Script Trauma Unwanted script syndrome. of course bang feruzz for header change script and all of my epic friends around this epic forum Requirements: [b]Addbox Function [/b] If your a new member you should read sticky tutorial about js ok Preview: [img]http://img259.imageshack.us/img259/248/pagecontrollervg7.jpg[/img] [quote]Goodies: Prototype effect Auto-scroll effect [/quote] Note: Instead of scrolling your whole profile... trying to locate your testimonial box, mp3 box, wvm box, or any boxes inside your profile.. that i know is very effin tiring... why not use this new trick? [b]this will easily trigger the box that you click from the profile controller.. like changing your television channel..[/b] wakakkakaw Ok prepare yourself and let's start... First Step: Create a folder inside your ripway account... download this effects [url]http://h1.ripway.com/blurrycloud/tracker33/blurry/blurredeffect.zip[/url] and upload it to your created folder Paste this above all your js code refer for the format.. Format: [quote]// for multiple js injection scriptFolder = 'http://h1.ripway.com/[b]username[/b]/[b]foldername[/b]/' var scripts = new Array() scripts[0] = '[b]prototype.js[/b]' scripts[1] = '[b]effect.js[/b]' scripts[2] = '[b]autoscroll.js[/b]' for(x in scripts){ myscripts = document.createElement('script') myscripts.src = scriptFolder+scripts[x] document.getElementsByTagName('head')[0].appendChild(myscripts); }[/quote] [b]Note:[/b] If you already have prototype.js and effects.js Just add autoscroll effect after the two effects [quote]scripts[2] = '[b]autoscroll.js[/b]'[/quote] Done? good 2nd Step: Study and focus... [quote] [b]all the red colored text from the 1st code below must be equal/same to the red colored text on the 2nd code below[/b] so that the exact box will be selected when a certain button was push from the Profile controller.. [/quote] [quote][b]//PROFILE CONTROLLER[/b] var blurryslide="<h4 id='content-index'></h4><ul><br>"+ "<li><a href='#[color=red]cpanel[/color]'><input class='cbutton' value='[b]About Me[/b]' onmouseover=\"this.className='cbutton cbuttonshov'\" onmouseout=\"this.className='cbutton'\"></a></li>"+ "<li><a href='#[color=red]moreabout[/color]'><input class='cbutton' value='[b]More About Me[/b]' onmouseover=\"this.className='cbutton cbuttonshov'\" onmouseout=\"this.className='cbutton'\"></a></li>"+ "<li><a href='#[color=red]comment[/color]'><input class='cbutton' value='[b]Comments Section[/b]' onmouseover=\"this.className='cbutton cbuttonshov'\" onmouseout=\"this.className='cbutton'\"></a></li>"+ "<li><a href='#[color=red]media[/color]'><input class='cbutton' value='[b]Media Box[/b]' onmouseover=\"this.className='cbutton cbuttonshov'\" onmouseout=\"this.className='cbutton'\"></a></li>"+ "<li><a href='[color=red]#groups[/color]'><input class='cbutton' value='[b]Group Section[/b]' onmouseover=\"this.className='cbutton cbuttonshov'\" onmouseout=\"this.className='cbutton'\"></a></li>"+ "<li><a href='[color=red]#fans[/color]'><input class='cbutton' value='[b]Fans Section[/b]' onmouseover=\"this.className='cbutton cbuttonshov'\" onmouseout=\"this.className='cbutton'\"></a></li>"; addBox("LEFT","Page Controller",blurryslide,"blurredcss","0"); [b] //HEADER CHANGE TWEAK[/b] var h; h=document.getElementById("controlpanel_header"); h.innerHTML="<h4 id='[color=red]cpanel[/color]'>TITLE_OF_CONTROLPANEL</h4>"; h=document.getElementById("6").getElementsByTagName("h2")[0]; h.innerHTML="<h4 id='[color=red]moreabout[/color]'>TITLE_MOREABOUT</h4>"; h=document.getElementById("18").getElementsByTagName("h2")[0]; h.innerHTML="<h4 id='[color=red]comment[/color]'>TITLE_TESTIBOX</h4>"; h=document.getElementById("10").getElementsByTagName("h2")[0]; h.innerHTML="<h4 id='[color=red]media[/color]'>TITLE_MEDIABOX</h4>"; h=document.getElementById("8").getElementsByTagName("h2")[0]; h.innerHTML="<h4 id='[color=red]groups[/color]'>TITLE_GROUPBOX</h4>"; h=document.getElementById("7").getElementsByTagName("h2")[0]; h.innerHTML="<h4 id='[color=red]fans[/color]'>TITLE_FANBOX</h4>";[/quote] [b]Paste the 1st and 2nd codes above inside your onload handler[/b] Refer here for your new boxes such as, mp3, wvm, cbox etc etc All you have to do is change the title header of your new box ex: for mp3 [quote][b]"<li><a href='[color=red]#mp3[/color]'><input class='cbutton' value='Music' onmouseover=\"this.className='cbutton cbuttonshov'\" onmouseout=\"this.className='cbutton'\"></a></li>";[/b][/quote] [quote]var blurryslide="<h4 id='content-index'></h4><ul><br>"+ "<li><a href='#[color=red]cpanel[/color]'><input class='cbutton' value='[b]About Me[/b]' onmouseover=\"this.className='cbutton cbuttonshov'\" onmouseout=\"this.className='cbutton'\"></a></li>"+ "<li><a href='#[color=red]moreabout[/color]'><input class='cbutton' value='[b]More About Me[/b]' onmouseover=\"this.className='cbutton cbuttonshov'\" onmouseout=\"this.className='cbutton'\"></a></li>"+ "<li><a href='#[color=red]comment[/color]'><input class='cbutton' value='[b]Comments Section[/b]' onmouseover=\"this.className='cbutton cbuttonshov'\" onmouseout=\"this.className='cbutton'\"></a></li>"+ "<li><a href='#[color=red]media[/color]'><input class='cbutton' value='[b]Media Box[/b]' onmouseover=\"this.className='cbutton cbuttonshov'\" onmouseout=\"this.className='cbutton'\"></a></li>"+ "<li><a href='[color=red]#groups[/color]'><input class='cbutton' value='[b]Group Section[/b]' onmouseover=\"this.className='cbutton cbuttonshov'\" onmouseout=\"this.className='cbutton'\"></a></li>"+ "<li><a href='[color=red]#fans[/color]'><input class='cbutton' value='[b]Fans Section[/b]' onmouseover=\"this.className='cbutton cbuttonshov'\" onmouseout=\"this.className='cbutton'\"></a></li>"+ [b]"<li><a href='[color=red]#mp3[/color]'><input class='cbutton' value='Music' onmouseover=\"this.className='cbutton cbuttonshov'\" onmouseout=\"this.className='cbutton'\"></a></li>";[/b] addBox("LEFT","Page Controller",blurryslide,"blurredcss","0");[/quote] [quote]var mp3="<div align=\"center\" id=\"radio\"><embed src='http://www.loudfusion.com/widgets/music/4' name='Loudfusion.com' quality='high' wmode='transparent' flashvars='USERID=332166&FOLDERID=12776' width='300' height='170' type='application/x-shockwave-flash'></embed>"+ "</div>"; addBox("RIGHT","[b]<h4 id='[color=red]mp3[/color]'>Music Section</h4>[/b]",mp3,"mp33",null);[/quote] notice that we just added a trigger control for your mp3... cool ei? [hr][hr][hr] For Addbox 3.2. [quote]addBox("Page Controller",blurryslide,"blurredcss",/commonbox[\s]*?controlpanel/i);[/quote] For the style of your buttons paste this inside your CSS [quote].cbutton { /* Active Buttons*/ color: #ff0033; font-family: Arial; font-size: 96%; font-weight: bold; background-color: #000000; border:1px solid #ff0033; width:128px; text-align:center; } .cbuttonshov { /* Effects When Buttons is Hovered */ color: #00ff00; font-family: Arial; font-size: 96%; font-weight: bold; background-color: #000000; border:1px solid #00ff00; text-align:center; }[/quote] change the hex code for your own desire... so that's it your done... [quote]Final Note: all boxes are possible to be triggered by this profile controller trick best with back to top of the page trick by regiehizon[/quote] [quote]Update: [b]Now working in all Major Browser...[/b] rock on IE user Just edit the 1st code(//PROFILE CONTROLLER) and encode the button style code inside your css[/quote]

Last edited by blurrycloud (2008-09-13 07:14:12)