Demonya bisa kawan-kawan lihat disini
selanjutnya simpan java script berikut tepat diatas kode </head> :
simpan template......
cara pemanggilannya :
Keterangan : sebagai tambahan. jika script http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js ini sudah ada pada template kawan-kawan, kawan semua tak perlu lagi mnambahkan script tadi pada template yang dipakai
- Cara membuatnya :
- Login blogger
- Rancangan, Edit Html, Cari kode ]]></b:skin>
- Dan Simpan kode berikut diatasnya :
/* Bounce menu with jQuery
----------------------------------------------- */
#topad {
width:465px;
height:130px;
padding-top:35px;
padding-right:20px;
float:right;
}
#vnav {
width:300px;
float:left;
}
#des {
width:600px;
float:right;
}
#des h1 {
font-size:24px;
text-shadow: 0 -1px 1px #CCC;
color:#779ec2;
}
#bounce li {
height:20px;
width:200px;
overflow:hidden;
color: #fff;
text-decoration: none;
font-weight: bold;
line-height: 1;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-moz-box-shadow: 0 1px 3px #999;
-webkit-box-shadow: 0 1px 3px #999;
text-shadow: 0 -1px 1px #222;
border-bottom: 1px solid #222;
padding: 7px 10px 6px;
margin-top:5px;
background-color:#a447cf;
}
#bounce li p {
margin-top:10px;
font-size:12px;
color:#6CF;
}
----------------------------------------------- */
#topad {
width:465px;
height:130px;
padding-top:35px;
padding-right:20px;
float:right;
}
#vnav {
width:300px;
float:left;
}
#des {
width:600px;
float:right;
}
#des h1 {
font-size:24px;
text-shadow: 0 -1px 1px #CCC;
color:#779ec2;
}
#bounce li {
height:20px;
width:200px;
overflow:hidden;
color: #fff;
text-decoration: none;
font-weight: bold;
line-height: 1;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-moz-box-shadow: 0 1px 3px #999;
-webkit-box-shadow: 0 1px 3px #999;
text-shadow: 0 -1px 1px #222;
border-bottom: 1px solid #222;
padding: 7px 10px 6px;
margin-top:5px;
background-color:#a447cf;
}
#bounce li p {
margin-top:10px;
font-size:12px;
color:#6CF;
}
selanjutnya simpan java script berikut tepat diatas kode </head> :
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js' type='text/javascript'/>
<script language='javascript' src='http://kangdadang.googlecode.com/files/jquery.easing.1.3.js' type='text/javascript'/>
<script src='http://kangdadang.googlecode.com/files/custom.js' type='text/javascript'/>
<script language='javascript' src='http://kangdadang.googlecode.com/files/jquery.easing.1.3.js' type='text/javascript'/>
<script src='http://kangdadang.googlecode.com/files/custom.js' type='text/javascript'/>
simpan template......
cara pemanggilannya :
<div id="vnav">
<ul id="bounce">
<li><h1>
Home</h1>
<a href="#">Home page</a></li>
<li><h1>
About Us</h1>
<a href="#">Check our Portfolio</a>
</li>
<li><h1>
Portfolio</h1>
<a href="#">Check our Portfolio</a>
</li>
<li><h1>
Contact Us</h1>
<a href="#">Check our Portfolio</a>
</li>
</ul>
</div>
<ul id="bounce">
<li><h1>
Home</h1>
<a href="#">Home page</a></li>
<li><h1>
About Us</h1>
<a href="#">Check our Portfolio</a>
</li>
<li><h1>
Portfolio</h1>
<a href="#">Check our Portfolio</a>
</li>
<li><h1>
Contact Us</h1>
<a href="#">Check our Portfolio</a>
</li>
</ul>
</div>
Keterangan : sebagai tambahan. jika script http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js ini sudah ada pada template kawan-kawan, kawan semua tak perlu lagi mnambahkan script tadi pada template yang dipakai
Terima Kasih