Pages: 12
Pertama tama minta ijin buat mod untuk buka tread ini :D kalaupun ini udah di share saya mohon maaf dan silahkan hapus aja :D Credit: 1.[url]http://www.andrewsellick.com[/url] 2.Ebeng ok saya langsu
You are viewing a post by EbengMaya. View all 26 posts in Pertama tama minta ijin buat mod untuk buka tread ini :D kalaupun ini udah di share saya mohon maaf dan silahkan hapus aja :D Credit: 1.[url]http://www.andrewsellick.com[/url] 2.Ebeng ok saya langsu.
2008-08-21 22:55:50
- EbengMaya
- » FTalkFreak
1890
0
1969-12-31
Pertama tama minta ijin buat mod untuk buka tread ini :D kalaupun ini udah di share saya mohon maaf dan silahkan hapus aja :D Credit: 1.[url]http://www.andrewsellick.com[/url] 2.Ebeng ok saya langsu
Pertama tama minta ijin buat mod untuk buka tread ini 
kalaupun ini udah di share saya mohon maaf dan silahkan hapus aja
Credit:
1.[url]http://www.andrewsellick.com[/url]
2.Ebeng
ok saya langsung jelaskan saja menu navigation yg saya share kali ini
pertama kamu download ini dl jangan lupa di extrack ya
[url]http://www.andrewsellick.com/71/fancy-sliding-menu-for-mootools[/url]
trs udah gt kamu upload image dan js ke web hostingan kamu
dan yg harus di upload itu adalah
1.mootols
2.tabslide
3.tab-left
4.tab-left-active
5.tab-right
6.ya pasang pic yg kamu inginkan untuk dijadiin background buat di banner menu navigationnya
setelah semuanya udah di upload skrg buat text file baru dan masukan kode ini 
[quote]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Mootools Fancy Sliding Tab Menu</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script src="[b]URL mootools.js[/b]" type="text/javascript"></script>
<script src="[b]URL tabslide.js[/b]" type="text/javascript"></script>
<style>
#accordion {
border: 1px solid #1F669B;
width: 600px;
height: 310px;
font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
font-size: 11px;
position:relative !important;
display:block;
overflow:hidden;
background-image:url([b]URL PIC KAMU[/b]);
background-repeat:no-repeat;
background-position:top left;
}
h3 {
font-size: 12px;
padding: 6px 6px 4px 35px;
margin: 0;
color:#fff;
border-bottom:1px solid #cc3300;
cursor:pointer;
display:block;
background-image:url([b]URL tab-left.gif[/b]);
background-position:top left;
background-repeat:no-repeat;
}
#visible {
background-image:url([b]URL tab-left-active.gif[/b]);
border-bottom:1px solid #cc3300;
}
.panel_body {
height:150px;
background-color:#ff0099;
display:block;
position:relative;
color:#FFFFFF;
}
.panel_body div {
padding:3px 5px;
}
.panel_container{
bottom:0px;
margin:0px;
padding:0px;
background-image:url([b]URL tab-right.gif[/b]);
background-position:top right;
background-repeat:repeat-x;
background-color:#cc3300;
}
.wrapper{
bottom:0px;
position:absolute;
}
</style>
</head>
<body>
<div id="accordion">
<div class="panel_container" id="panel1">
<h3 id="visible">Panel 1</h3>
<div id="panel1-body" class="panel_body">
<div>
<a style="text-decoration:none;" href="[b]http://www.friendster.com[/b]" onclick="window.open(this.href, 'spammers', 'resizable=yes,status=yes,scrollbars=yes,width=950,height=920'); return false;"><font size="4" color="ffffff" face="comic sans ms">[b]Home[/b]</font></a>
</div>
</div>
</div>
<div class="panel_container" id="panel2">
<h3>Panel 2</h3>
<div id="panel2-body" class="panel_body">
<div>
<a style="text-decoration:none;" href="[b]http://profiles.friendster.com/user.php[/b]" onclick="window.open(this.href, 'spammers', 'resizable=yes,status=yes,scrollbars=yes,width=950,height=920'); return false;"><font size="4" color="ffffff" face="comic sans ms">[b]Profile[/b]</font></a>
</div>
</div>
</div>
<div class="panel_container" id="panel3">
<h3>Panel 3</h3>
<div id="panel3-body" class="panel_body">
<div>
<a style="text-decoration:none;" href="[b]http://www.friendster.com/editprofile.php[/b]" onclick="window.open(this.href, 'spammers', 'resizable=yes,status=yes,scrollbars=yes,width=950,height=920'); return false;"><font size="4" color="ffffff" face="comic sans ms">[b]Edit Profile[/b]</font></a>
</div>
</div>
</div>
<div class="panel_container" id="panel4">
<h3>Panel 4</h3>
<div id="panel4-body" class="panel_body">
<div>
<a style="text-decoration:none;" href="[b]http://www.friendster.com/logout.php[/b]" onclick="window.open(this.href, 'spammers', 'resizable=yes,status=yes,scrollbars=yes,width=950,height=920'); return false;"><font size="4" color="ffffff" face="comic sans ms">[b]Logout[/b]</font></a>
</div>
</div>
</div>
<div class="panel_container" id="panel5">
<h3>Panel 5</h3>
<div id="panel5-body" class="panel_body">
<div>
<a style="text-decoration:none;" href="[b]http://profiles.friendster.com/mayalovesebeng[/b]" onclick="window.open(this.href, 'spammers', 'resizable=yes,status=yes,scrollbars=yes,width=950,height=920'); return false;"><font size="4" color="ffffff" face="comic sans ms">[b]Friendster Maya[/b]</font></a>
</div>
</div>
</div>
</div>
<script>init();</script>
</body>
</html>[/quote]
edit yg udah di bold
kamu jg bisa edit warna sesuai profile fs kamu
untuk ukuran pic buat menu navigation di usahakan berukuran 640x362
save file di atas dgn format HTML misal >>>TABSLIDEV2-MOOTOOLS.HTML
skrg langkah terakhirnya masukan kode ini ke dalam js kamu
[quote]// Navigation TABSLIDEV2 By.Ebeng
var navidock;
try {navidock = document.createElement("div");}
catch (e) {navidock = document.createElement("<div>");}
navidock.innerHTML = "<iframe id=\"datamain\" src=\"[b]URL HTML TABSLIDE KAMU[/b]\" width=\"630\" height=\"350px\" marginheight=\"0\" hspace=\"0\" vspace=\"0\" frameborder=\"0\" scrolling=\"no\"></iframe>";
navidock.setAttribute("style","text-align:center;padding-top:10px");
document.getElementById("logo").parentNode.appendChild(navidock);[/quote]
simpan kode js di bagian B aja 
bagi kalian pecinta center and one coloum profile untuk heigh dan width nya bisa di sesuaikan sesuai selera kalian
Live Preview[url]http://h1.ripway.com/agam12/preview.html[/url]
kalaupun ini udah di share saya mohon maaf dan silahkan hapus aja
Credit:
1.[url]http://www.andrewsellick.com[/url]
2.Ebeng
ok saya langsung jelaskan saja menu navigation yg saya share kali ini
pertama kamu download ini dl jangan lupa di extrack ya
[url]http://www.andrewsellick.com/71/fancy-sliding-menu-for-mootools[/url]
trs udah gt kamu upload image dan js ke web hostingan kamu
dan yg harus di upload itu adalah
1.mootols
2.tabslide
3.tab-left
4.tab-left-active
5.tab-right
6.ya pasang pic yg kamu inginkan untuk dijadiin background buat di banner menu navigationnya
setelah semuanya udah di upload skrg buat text file baru dan masukan kode ini
[quote]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Mootools Fancy Sliding Tab Menu</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script src="[b]URL mootools.js[/b]" type="text/javascript"></script>
<script src="[b]URL tabslide.js[/b]" type="text/javascript"></script>
<style>
#accordion {
border: 1px solid #1F669B;
width: 600px;
height: 310px;
font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
font-size: 11px;
position:relative !important;
display:block;
overflow:hidden;
background-image:url([b]URL PIC KAMU[/b]);
background-repeat:no-repeat;
background-position:top left;
}
h3 {
font-size: 12px;
padding: 6px 6px 4px 35px;
margin: 0;
color:#fff;
border-bottom:1px solid #cc3300;
cursor:pointer;
display:block;
background-image:url([b]URL tab-left.gif[/b]);
background-position:top left;
background-repeat:no-repeat;
}
#visible {
background-image:url([b]URL tab-left-active.gif[/b]);
border-bottom:1px solid #cc3300;
}
.panel_body {
height:150px;
background-color:#ff0099;
display:block;
position:relative;
color:#FFFFFF;
}
.panel_body div {
padding:3px 5px;
}
.panel_container{
bottom:0px;
margin:0px;
padding:0px;
background-image:url([b]URL tab-right.gif[/b]);
background-position:top right;
background-repeat:repeat-x;
background-color:#cc3300;
}
.wrapper{
bottom:0px;
position:absolute;
}
</style>
</head>
<body>
<div id="accordion">
<div class="panel_container" id="panel1">
<h3 id="visible">Panel 1</h3>
<div id="panel1-body" class="panel_body">
<div>
<a style="text-decoration:none;" href="[b]http://www.friendster.com[/b]" onclick="window.open(this.href, 'spammers', 'resizable=yes,status=yes,scrollbars=yes,width=950,height=920'); return false;"><font size="4" color="ffffff" face="comic sans ms">[b]Home[/b]</font></a>
</div>
</div>
</div>
<div class="panel_container" id="panel2">
<h3>Panel 2</h3>
<div id="panel2-body" class="panel_body">
<div>
<a style="text-decoration:none;" href="[b]http://profiles.friendster.com/user.php[/b]" onclick="window.open(this.href, 'spammers', 'resizable=yes,status=yes,scrollbars=yes,width=950,height=920'); return false;"><font size="4" color="ffffff" face="comic sans ms">[b]Profile[/b]</font></a>
</div>
</div>
</div>
<div class="panel_container" id="panel3">
<h3>Panel 3</h3>
<div id="panel3-body" class="panel_body">
<div>
<a style="text-decoration:none;" href="[b]http://www.friendster.com/editprofile.php[/b]" onclick="window.open(this.href, 'spammers', 'resizable=yes,status=yes,scrollbars=yes,width=950,height=920'); return false;"><font size="4" color="ffffff" face="comic sans ms">[b]Edit Profile[/b]</font></a>
</div>
</div>
</div>
<div class="panel_container" id="panel4">
<h3>Panel 4</h3>
<div id="panel4-body" class="panel_body">
<div>
<a style="text-decoration:none;" href="[b]http://www.friendster.com/logout.php[/b]" onclick="window.open(this.href, 'spammers', 'resizable=yes,status=yes,scrollbars=yes,width=950,height=920'); return false;"><font size="4" color="ffffff" face="comic sans ms">[b]Logout[/b]</font></a>
</div>
</div>
</div>
<div class="panel_container" id="panel5">
<h3>Panel 5</h3>
<div id="panel5-body" class="panel_body">
<div>
<a style="text-decoration:none;" href="[b]http://profiles.friendster.com/mayalovesebeng[/b]" onclick="window.open(this.href, 'spammers', 'resizable=yes,status=yes,scrollbars=yes,width=950,height=920'); return false;"><font size="4" color="ffffff" face="comic sans ms">[b]Friendster Maya[/b]</font></a>
</div>
</div>
</div>
</div>
<script>init();</script>
</body>
</html>[/quote]
edit yg udah di bold
kamu jg bisa edit warna sesuai profile fs kamu
untuk ukuran pic buat menu navigation di usahakan berukuran 640x362
save file di atas dgn format HTML misal >>>TABSLIDEV2-MOOTOOLS.HTML
skrg langkah terakhirnya masukan kode ini ke dalam js kamu
[quote]// Navigation TABSLIDEV2 By.Ebeng
var navidock;
try {navidock = document.createElement("div");}
catch (e) {navidock = document.createElement("<div>");}
navidock.innerHTML = "<iframe id=\"datamain\" src=\"[b]URL HTML TABSLIDE KAMU[/b]\" width=\"630\" height=\"350px\" marginheight=\"0\" hspace=\"0\" vspace=\"0\" frameborder=\"0\" scrolling=\"no\"></iframe>";
navidock.setAttribute("style","text-align:center;padding-top:10px");
document.getElementById("logo").parentNode.appendChild(navidock);[/quote]
simpan kode js di bagian B aja
bagi kalian pecinta center and one coloum profile untuk heigh dan width nya bisa di sesuaikan sesuai selera kalian
Live Preview[url]http://h1.ripway.com/agam12/preview.html[/url]
Last edited by EbengMaya (2008-08-22 07:00:16)
 |