sumber duit

Membuat Back to Top Back to Down

nah loo karena bnyk yg tanya" ke gw cara buat BtT dan BtD diblogku kali ini aku share lah caranya..sebelumnya trick ini ane dari blog master yakni SCH-XP ..yaa trick ini trick yg simple /..sperti apa trick kali ini ?? berikut SS nya:
langkah" utk memubuatnya:
1. loggin blogger
2.Template
3. HTML/javascipt
4. cari kode ]]></b:skin> pke CTRL+F utk mempermudah
5. letakkan kode berikut DIATAS ]]></b:skin>

/* Tombol Atas dan Bawah Dengan jQuery
----------------------------------------------- */
.tombol_atas{
padding:7px; /* Distance between the border and the icon */
background-color:white;
border:1px solid #CCC; /* Border Color */
position:fixed;
background: white url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3rs3oaP8Bj2s2are5Cd_F6jWML-l3rIJ6giaolufJq1DiI3UqUQRMVN_cs5flUpQVPH6LM-0Z9E_Sjk6YN_p0D-NYzZSK4EhdRPCWAGzotourXqvhcg1tDCjTNc2BsHasEFaN6FbZyJo/s16/arrow_up.png) no-repeat top left;
background-position:50% 50%;
width:20px; /* Buttons width */
height:20px; /* Buttons height */
bottom:280px; /* Distance from the bottom */
right:5px; /* Change right to left if you want the buttons on the left */
white-space:nowrap;
cursor: pointer;
border-radius: 3px 3px 3px 3px;
opacity:0.7;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}
.tombol_bawah{
padding:7px; /* Distance between the border and the icon */
background-color:white;
border:1px solid #CCC; /* Border Color */
position:fixed;
background: white url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiJcC2qg5O1Lb21X73WVXvVqIUBgoEUGUvrTlOmZlRLiHSE6g9bjG62tM2-7hS7a_mVuarlEeeLuwo0VRsBPIX0GB65PMzhH3A1NDNfH_g0nXONVKOjV3zFzms5WFh84R921DoxkoNgLg/s16/arrow_down.png) no-repeat top left;
background-position:50% 50%;
width:20px; /* Buttons width */
height:20px; /* Buttons height */
bottom:242px; /* Distance from the bottom */
right:5px; /* Change right to left if you want the buttons on the left */
white-space:nowrap;
cursor: pointer;
border-radius: 3px 3px 3px 3px;
opacity:0.7;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}

6. cari kode </body>  
7. copy kode berikut DIATAS </body>

<script src=http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js type=text/javascript/>
<div class=tombol_atas id=tombol_atas style=display:none;/>
<div class=tombol_bawah id=tombol_bawah style=display:none;/>
<script>
//<![CDATA[
(function(){var special=jQuery.event.special,uid1=D+(+new Date()),uid2=D+(+new Date()+1);special.scrollstart={setup:function(){var timer,handler=function(evt){var _self=this,_args=arguments;if(timer){clearTimeout(timer)}else{evt.type=scrollstart;jQuery.event.handle.apply(_self,_args)}timer=setTimeout(function(){timer=null},special.scrollstop.latency)};jQuery(this).bind(scroll,handler).data(uid1,handler)},teardown:function(){jQuery(this).unbind(scroll,jQuery(this).data(uid1))}};special.scrollstop={latency:300,setup:function(){var timer,handler=function(evt){var _self=this,_args=arguments;if(timer){clearTimeout(timer)}timer=setTimeout(function(){timer=null;evt.type=scrollstop;jQuery.event.handle.apply(_self,_args)},special.scrollstop.latency)};jQuery(this).bind(scroll,handler).data(uid2,handler)},teardown:function(){jQuery(this).unbind(scroll,jQuery(this).data(uid2))}}})();
$(function() {
var $elem = $(body);
$(#tombol_atas).fadeIn(slow);
$(#tombol_bawah).fadeIn(slow);
$(window).bind(scrollstart, function(){
$(#tombol_atas,#tombol_bawah).stop().animate({opacity:0.2});
});
$(window).bind(scrollstop, function(){
$(#tombol_atas,#tombol_bawah).stop().animate({opacity:1});
});
$(#tombol_bawah).click(
function (e) {
$(html, body).animate({scrollTop: $elem.height()}, 800);
} );
$(#tombol_atas).click(
function (e) {
$(html, body).animate({scrollTop: 0px}, 800);
} );});
//]]>
</script>

nah save aja..
nah semoga bermanfaat yaa,, tpi trick ini akan memberatkan loading blog,,, jdi kira" aja yaa.. :v
sumber nya dri blog mastah SCH-XP
Jangan lupa tinggalkan komentar yaa :D