Sabtu, 10 Desember 2011
Sudah lama saya tidak berbagi tentang tutorial blog nah hanya ingin sekedar berbagi Pasang Plugin Back To Top ke blog dengan bantuan jQury ikuti langkah - langkah dibawah ini
- Masuk Kedalam dasboard anda pilih template --> edit template --> jangan lupa centang Expand Template Widget *catatan sebelum melakukan langkah ini download dulu template anda untuk menghindari kesalahan dalam mengedit template.
- Cari kode ]]></b:skin> klik Ctrl dan F untuk memudah kan mencari
- Masukkan kode dibawah ini, copy dan paste kode dibawah sebelum kode ini ]]></b:skin>
#toTop {Catatan - Untuk memindah tombol kesebelah kiri blog anda ganti right:10px ke left:10px
display:none;
text-decoration:none;
position:fixed;
bottom:10px;
right:10px;overflow:hidden;
width:51px;
height:51px;
border:none;
text-indent:-999px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhx1craMHNIIewyyMt8Mzjh0kB-v5CMP6GnGQQ2TbE1Wq-ZFRcRoGzKtYum1gqWcBHUXJEaxgF4lWIdbyBTpqq-jU-JP97hCPvf8YfyjB6EJ9HwmQDg1ruKFj-2k8T2sAoR5QJksFemz60/s1600/ui.totop.png) no-repeat left top;
}
#toTopHover {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhx1craMHNIIewyyMt8Mzjh0kB-v5CMP6GnGQQ2TbE1Wq-ZFRcRoGzKtYum1gqWcBHUXJEaxgF4lWIdbyBTpqq-jU-JP97hCPvf8YfyjB6EJ9HwmQDg1ruKFj-2k8T2sAoR5QJksFemz60/s1600/ui.totop.png) no-repeat left -51px;
width:51px;
height:51px;
display:block;
overflow:hidden;
float:left;
opacity: 0;
-moz-opacity: 0;
filter:alpha(opacity=0);
}
#toTop:active, #toTop:focus {
outline:none;
}
4. Cari kode </head> klik Ctrl dan F untuk memudah kan mencari.
5. Masukkan kode dibawah ini, copy dan paste kode dibawah sebelum kode ini </head>
6. Simpan template anda dan selesai<script src='http://code.jquery.com/jquery-1.6.1.min.js' type='text/javascript'/><script src='http://suyb.googlecode.com/files/jquery.easing.1.3.js' type='text/javascript'/>
<script src='http://suyb.googlecode.com/files/jquery.ui.totop.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function() {
/*
var defaults = {
containerID: 'moccaUItoTop', // fading element id
containerHoverClass: 'moccaUIhover', // fading element hover class
scrollSpeed: 1200,
easingType: 'linear'
};
*/
$().UItoTop({ easingType: 'easeOutQuart' });
});
</script>
Related Posts :
- Back to Home »
- Tutorial Blog »
- Tutorial Pasang Plugin Back To Top ke Blog
nice share gan..mantap gan.
BalasHapusSilahkan di coba gan..
BalasHapusNice post + Nice info dangsanak..!!
BalasHapusterima kasih dangsanak support nya
BalasHapus