Sticky Widget | Pada kesempatan kali ini sya akan membagikan tutorial yang sangat singkat ini.
Sticky dalam Bahasa Indonesia artinya menempel. Sticky Widget Sidebar berarti membuat widget yang selalu menempel walaupun mouse kita scroll. Untuk demonya sendiri bisa dilihat di samping blog kang vanno.
Untuk membuat Sticky widget ini, ada tiga langkah mudah, silahkan simak satu persatu.
1. Menambakan kode CSS
2. Menambah kode JavaScript
Ganti
Selamat berkreasi dengan Sticky widget.....
Sticky dalam Bahasa Indonesia artinya menempel. Sticky Widget Sidebar berarti membuat widget yang selalu menempel walaupun mouse kita scroll. Untuk demonya sendiri bisa dilihat di samping blog kang vanno.
Untuk membuat Sticky widget ini, ada tiga langkah mudah, silahkan simak satu persatu.
1. Menambakan kode CSS
2. Menambah kode JavaScript
Berikut Tutorialnya
Langkah 1 : Tambahkan CSS di atas kode</style>
/ ]]></b:skin>
.sticky {
position: fixed;
top: 10px; /* jarak dari atas*/
z-index: 100;
}
Langkah 2 : Simpan Javascript di atas </body>
<script type='text/javascript'>
$(document).ready(function() {
var stickyWidgetTop = $('#HTML7').offset().top;
var stickyWidget = function(){
var scrollTop = $(window).scrollTop();
if (scrollTop > stickyWidgetTop) {
$('#HTML7').addClass('sticky');
} else {
$('#HTML7').removeClass('sticky');
}
};
stickyWidget();
$(window).scroll(function() {
stickyWidget();
});
});
</script>
Ganti
#HTML7
dengan ID widget yang akan dibuat sticky.Selamat berkreasi dengan Sticky widget.....
http://blog.kangismet.net/2012/10/membuat-sticky-widget-sidebar-di.html
3 comments
Click here for commentsKerenn gan..widgetnya
ReplySaling follow GFC + Tukar link yuks..
http://tipsfadhil.blogspot.com
Info yang bermanfaat,izin pasang di blog saya gan...:2thumbup
Replysilahkan sob
ReplyBerkomentarlah dengan sopan.
Berkomentarlah sesuai topik yang dibahas #ThinkHIGH! ^_^ ConversionConversion EmoticonEmoticon