[b]CREDITS:[/b]
XAVIER
SHIROW MASAMUNE
me.. (hehe)
This is basically a compilation of codes that formed into a new breed of layouts..
A [b]Demi-overlay[/b] (credits to Shirow for the name) is a cross between a CSS and an OVERLAY layout. It uses var replacement codes and sir Xavier's content changer. It is not that hard to work on but There are a few requirements that need to be done beforehand:
[b]You must have complete knowledge of this thread: [/b][url]http://theftalk.com/t7708-link%28from-sidebar-mainbar-vice-versa%29.html[/url]
You must be a firefox user! it looks hellish in IE (coz IE sucks!)
must have hide codes for all boxes except groups box and cpbox!! (it depends on you)
ok then..
first paste the codes of xavier like this:
[b]STEP 1:[/b] (make the buttons)
inside the loader (you can still edit this)
[quote]var benjo="<a href=\"javascript:onClick=get_properties('2')\">photos</a></br>"+
"<a href=\"javascript:onClick=get_properties('6')\">about me </a></br>"+
"<a href=\"javascript:onClick=get_properties('2')\"></a> friends</br>"+
"<a href=\"javascript:onClick=get_properties('18')\">comments</a></br>"+
"<a href=\"javascript:onClick=get_properties('footer_container')\">footer</a></br>"+
"<a href=\"javascript:onClick=get_properties('12')\">back</a></center>";
document.getElementById('8').style.height='100%';
document.getElementById('8').style.overflowY='hidden';
document.getElementById('8').innerHTML = "<table width='100%'><tr><td align='center'>"+benjo+"</td></tr></table>";[/quote]
you can do image buttons... these are my codes (im happy to share)
[quote]var hudas = "<center>"+"<a href=\"javascript:onClick=get_properties('12')\"><img border='0' src= '[b]
http://h1.ripway.com/dracoknight09/BUTTONS/control.gif[/b]' /><br></a>"+
"<a href=\"javascript:onClick=get_properties('1')\"><img border='0' src= '[b]
http://h1.ripway.com/dracoknight09/BUTTONS/photos.gif[/b]' /><br></a>"+"<a href=\"javascript:onClick=get_properties('2')\"><img border='0' src= '[b]
http://h1.ripway.com/dracoknight09/BUTTONS/friends.gif[/b]' /><br></a>"+
"<a href=\"javascript:onClick=get_properties('7')\"><img border='0' src= [b]'http://h1.ripway.com/dracoknight09/BUTTONS/youtube.gif[/b]' /><br></a>"+
"<a href=\"javascript:onClick=get_properties('18')\"><img border='0' src= '[b]
http://h1.ripway.com/dracoknight09/BUTTONS/comments.gif[/b]' /><br></a>"+
"<a href=\"javascript:onClick=get_properties('subnav')\"><img border='0' src= '[b]
http://h1.ripway.com/dracoknight09/BUTTONS/copy.gif[/b]' /><br></a>"+"</center>";
document.getElementById('8').style.height='100%';
document.getElementById('8').style.overflowY='hidden';
document.getElementById('8').innerHTML = "<table width='100%'><tr><td align='center'>"+hudas+"</td></tr></table>";[/quote]
i dont mind if you use my images but you can change the bold text to add images of your own
[b]NEXT[/b]: replace the contents of the hidden boxes..
guys this is the bug i fixed
[b]RULES:[/b]
1. you really need to replace the contents of your cp in order for its sidebar button to seemingly function..
2. what you replace inside the cpbox you must put the same inside the reviews box.
ok then..
for the replacements codes this is the basic var code:
[quote]var blackbord = "[b]YOUR CONTENTS HERE!![/b]";
document.getElementById('[b]div_id[/b]').style.height='100%';
document.getElementById('[b]div_id[/b]').style.overflowX='hidden';
document.getElementById('[b]div_id[/b]').innerHTML = "<table width='100%'><tr><td align='center'>"+blackbord+"</td></tr></table>";[/quote]
replace the bold text and paste inside the onloadhandler..
lastly paste this code outside the loader @ the very bottom of your js codes
[quote]function get_properties(id) {
document.getElementById('0').innerHTML=document.getElementById(id).innerHTML
}[/quote]
with enough practice you can make a cool [b]DEMI-OVERLAY[/b] layout
to see live previews:
SHIROW's TEST PAGE
[url]http://www.friendster.com/masamuneisnotemo[/url]
MY PROFEE
[url]http://profiles.friendster.com/48500265[/url]
this is the new age of layouts come and join us!!
Last edited by dracoknight09 (2008-01-12 12:59:18)