Monday, July 11, 2011
Buat Efek Toggle Sidebar Blog dengan "jQuery"
Posted by
Sibuk Banget |
Gimana tertarik untuk mencobanya??
Berikut langkah - langkah pembuatannya.
1. Login ke Akun Blogger anda masing-masing
2. Klik Design atau Rancangan, kemudian pilih edit html
3. Centang Expand Widget Template (saya anjurkan download dahulu template anda)
4. Cari kode : ]]></b:skin>
Lalu letakkan Kode CSS dibawah ini sebelum atau diatas kode ]]></b:skin>
#sidebar h2 {
background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcKtYd1_jkEyWgw9E-1uljFj2pRCKx5kZe5Drmvx_KtDEEvmTKTUNxneUc7qIP2VsH3HgFdd-r07Sk5VbvpRDHZRCVClz0nRgXGVlOt2HdnJrc4_wWDteka9dbEsq6Gk_bNon8BvLQ3Yyq/")no-repeat 100% 50%;
}
#sidebar h2.headactive {
background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihXqiOUp5bglIItZoAmFGpD-m2ZKgvwafA4ivMcTJIeX8KFN8312avEOdqqUzSZIPcfaN1265gfhnN6GDcD1VF7n88JQ0s_gzfehsFkizLlPIAUPGp4AVorLq4mS2ibTHgycymsd-EalcL/")no-repeat 100% 50%;
border-bottom:1px solid #282828;
}
#sidebar2 h2.headactive {
background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcKtYd1_jkEyWgw9E-1uljFj2pRCKx5kZe5Drmvx_KtDEEvmTKTUNxneUc7qIP2VsH3HgFdd-r07Sk5VbvpRDHZRCVClz0nRgXGVlOt2HdnJrc4_wWDteka9dbEsq6Gk_bNon8BvLQ3Yyq/")no-repeat 100% 50%;
}
::: Sobat dapat mengedit code CSS diatas sesuka anda,
5. Setelah Itu taruh kode dibawah ini dibawah kode ]]></b:skin> , atau diatas kode </head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
var sidebarnameacc1="sidebar";
var accordionside1=true;
var sideshow1=new Array(0,0);
var sidebarnameacc2="sidebar2";
var accordionside2=false;
var sideshow2=new Array(0,0);
</script>
<script src='http://introbloggerscripts.googlecode.com/files/accordionscriptv101-min.js' type='text/javascript'/>
6. Langkah terakhir Save, dan lihat hasilnya..
Labels:
jQuery
Subscribe to:
Post Comments (Atom)
0 comments:
Post a Comment