dua cara memasang BACK TO TOP dengan gaya berbeda di blog

Posted by : Ivankgribatako Senin, 25 Agustus 2014

ada dua cara memasang back to top dgn gaya yg berbeda di blog
pertama,,,back to top dgn gambar atau animasi...
kedua,,,back to top dgn gaya berbentuk link...
back to top biasanya di pasang di pojok kanan bawah,.
tapi back to top ini saya pasang di pojok kiri bawah,..
ok,..langsung aja menuju ke TKP,..

login akun blog sobat
klik TEMPLATE
klik edit HTML
klik expand widget template
cari kode di bawa ini ]]></b:skin> control+f,,,jika ingin temukan kode tsb
kemudian copas kode di bawah tepat diatas kode ini ]]></b:skin>

#backtotop {
width:100px; /* Change Box Width*/
background:#3EF905; /* Change background color*/
border:2px solid #1D05F9; /* Change Border Style*/
text-align:center;
padding:5px;
position:fixed;
bottom:10px;right:10px;
cursor:pointer;
color:#F5030F; /* Change text color*/
text-decoration:none;
}

kemudian cari kode ini </body>
dan copas kode di bawah tepat di atas kode ini </body>

'' back to top dgn gambar/animasi ''
<a href='#' id='backtotop'><img alt='back to top' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjFZdmeeYE2r37XkkWZi9-7DVQZmX0r-F3cjwsbCrbpX7X67_YyGFeAkMmaIiCSuvfFA7JljAkh8zh0l16ZPZeXIuJxdJBCb2v5StNf4BLCEy4K5Enk_f4zXpAlguLOr0TdDtK13TZ2udm8/s400/bttp-14.png'/></a>

'' back to top dgn bentuk link ''

<a href="#" id="backtotop">Back to top</a>

trus cari kode ini <head>

dan copas kode di bawah tepat di bawah kode ini <head>

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