^Princess Blue^



Disclaimer..



Welcome to Princess Blue! blog! You can find friend in here, Find my Tutobies.. And you can be my friend.. Thankyou! Thanks to Azkiya Kiya for this blogskins...

Tick, Tock, Tick, Tock..

Chit Chat Here!


My Old Post


Archive
My Status


Welcome to My Blog :) Have Fun!

Credits

© 2014 - Full Template by Azkiya Kiya and the basecode fromAnugerah Salsa. Big Helped from B L U E. The Owner : Sahda Ristya
Jquery Top Button
Jumat, 04 Juli 2014 | 0 Princess

Assalamu'alaikum,
Hy all..! Kali ini aku akan share cara membuat jquery top button. Itu lhoo, yang biasanya tulisannya "Up". Tujuannya biar mudah untuk kembali ke atas. Yuk langsung aja klita lihat tutonnya!


Copy code dibawah ini:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script><script type="text/javascript" >/*********************************************** * Scroll To Top Control script- &#169; Dynamic Drive DHTML code library(www.dynamicdrive.com)* Modified byNafaraisya***********************************************/var scrolltotop={ setting: {startline:100, scrollto: 0, scrollduration:1000, fadeduration:[500, 100]}, controlHTML: '<img src="URL Top Button" />', controlattrs: {offsetx:5, offsety:5}, anchorkeyword: '#top', state: {isvisible:false, shouldvisible:false}, scrollup:function(){ if (!this.cssfixedsupport) this.$control.css({opacity:0}) var dest=isNaN(this.setting.scrollto)? this.setting.scrollto : parseInt(this.setting.scrollto) if (typeof dest=="string" && jQuery('#'+dest).length==1) dest=jQuery('#'+dest).offset().top else dest=0 this.$body.animate({scrollTop: dest}, this.setting.scrollduration); }, keepfixed:function(){ var $window=jQuery(window) var controlx=$window.scrollLeft() + $window.width() - this.$control.width() - this.controlattrs.offsetx var controly=$window.scrollTop() + $window.height() - this.$control.height() - this.controlattrs.offsety this.$control.css({left:controlx+'px', top:controly+'px'}) }, togglecontrol:function(){ var scrolltop=jQuery(window).scrollTop() if (!this.cssfixedsupport) this.keepfixed() this.state.shouldvisible=(scrolltop>=this.setting.startline)? true : false if (this.state.shouldvisible && !this.state.isvisible){ this.$control.stop().animate({opacity:1}, this.setting.fadeduration[0]) this.state.isvisible=true } else if (this.state.shouldvisible==false && this.state.isvisible){ this.$control.stop().animate({opacity:0}, this.setting.fadeduration[1]) this.state.isvisible=false } }, init:function(){ jQuery(document).ready(function($){ var mainobj=scrolltotop var iebrws=document.all mainobj.cssfixedsupport=!iebrws || iebrws && document.compatMode=="CSS1Compat" && window.XMLHttpRequest mainobj.$body=(window.opera)? (document.compatMode=="CSS1Compat"? $('html') : $('body')) : $('html,body') mainobj.$control=$('<div id="topcontrol">'+mainobj.controlHTML+'</div>') .css({position:mainobj.cssfixedsupport? 'fixed' : 'absolute', bottom:mainobj.controlattrs.offsety, right:mainobj.controlattrs.offsetx, opacity:0, cursor:'pointer'}) .attr({title:'Scroll Back to Top'}) .click(function(){mainobj.scrollup(); return false}) .appendTo('body') if (document.all && !window.XMLHttpRequest && mainobj.$control.text()!='') mainobj.$control.css({width:mainobj.$control.width()}) mainobj.togglecontrol() $('a[href="' + mainobj.anchorkeyword +'"]').click(function(){ mainobj.scrollup() return false }) $(window).bind('scroll resize', function(e){ mainobj.togglecontrol() }) }) } } scrolltotop.init() </script>

Jika sudah, paste kode diatas sesuai keterangan berikut

 Blogskins : Dashboard > Template > Search code </style> dan paste kan di atasnya
 Designer : Dashboard > Tata Letak > HTML/Javascript

 Jangan lupa code berwarna merah di atas di ganti dengan url gambar top buttonmu ya!

Credit to: Zahra

Ohya, yg mau gambar top button nya, cari saja di freebies blog ini, ada banyak, kok :)
Ok, selamat mencoba, smoga berhasil :D


^Sahda Ristya^

Label:


? Newer Post
Older Post ?