05 June 2011

tutorial ; slide up top button

                                            Tumblr_lmavndkkxm1qhioqno1_500_large

hello bloggers :)

tuto kali nie macam mane nak buat top button yang ala-ala Tumbele tu . bila kita tekan , dye akan slide terus dekat atas woooshh ~ ok , tuto nie ade 2 orang yang request ; Muazz Adli dengan Hanako . hee ~ ok , let's start it bebehh :P  

 Dashboard > Design > Edit HTML > CTRL + F and search ;

]]></b:skin>

sebelum code tu ]]></b:skin> tambah code nie ;

#backtotop {padding:5px;position:fixed;bottom:10px;right:10px;cursor:pointer;}

 cari code nie pulak ; 

</body>
sebelum code tu , tambah code nie ;

 <a href="#" id="backtotop"><img src="URL IMAGE" alt="back to top" /></a>

URL IMAGE tu boleh tukar dengan URL top button korang . 

 cari pulak code nie ;

<head>

tambah kan code nie selepas code <head> ;


&lt;script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js' type='text/javascript'&gt;&lt;/script&gt; &lt;script language=&quot;javascript&quot;&gt; $(window).ready(function(){ $('#backtotop').click(function(e){ e.preventDefault(); $('html, body').animate({scrollTop:0}, 'slow');

  lepas dah selesai buat step 1 , 2 dengan 3 tu . now korang boleh


 tekan Save Template 


selamat menteraii :))


kalau tak nak yang nie . try tuto farah okayy ? heee~

Photobucket

6 comments:

Anonymous said...

hmm , knpe bile nina buat page element jadi berterabur ? :( tapi nina dah buang . naseb baik

said...

thank for the tuto :DDDD

said...

leh tak nie gna lau gna template sendri

said...

dekat mana buat signature nama afiq kat atas tu? Cantik :) I want to try it. Please ajar.

said...

kalau untuk template blogskins ? ada tak ? i really want it

said...

hey , yg back to top awk yg skrng 2.. boleh x ajarkan ?