Jquery "back to top" and "go to bottom"

Φίλοι bloggers, ένα νεώτερο και πιο βελτιωμένο "back to top" and "go to bottom" με script, πολύ πιο πρακτικό και πιο εμφανίσιμο σας έχω σήμερα...θα βρείτε DEMO ΕΔΩ ...εσείς απλά ακολουθήστε τις οδηγίες που σας δίνω και ίσως αλλάξτε τα εικονίδια -βελάκια με τα δικά σας
Πρώτα μπείτε στο πρότυπό σας και με ctrl F (πατώντας τον κέρσορα μέσα στο πρότυπο - σύμφωνα με το νέο blogger), βρείτε τη φράση ]]></b:skin> (για να εγκαταστήσετε τον κώδικα σχεδιασμού css)...και ΠΑΝΩ -ΠΡΙΝ από αυτή τη φράση επικολλήστε τον παρακάτω κώδικα :

/* Up and Down Buttons with jQuery
----------------------------------------------- */
.button_up{
padding:7px; /* Distance between the border and the icon */
background-color:white;
border:1px solid #CCC; /* Border Color */
position:fixed;
background: white url(https://lh6.googleusercontent.com/-_gszUN0FCU4/UG64svlFn9I/AAAAAAAAF0o/WTerqjz8WlI/s48/up.png) no-repeat top left;
background-position:50% 50%;
width:30px; /* Button's width */
height:30px; /* Button's height */
bottom:290px; /* Distance from the bottom */
left: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);
}
.button_down{
padding:7px; /* Distance between the border and the icon */
background-color:white;
border:1px solid #CCC; /* Border Color */
position:fixed;
background: white url(https://lh4.googleusercontent.com/-CED5-rpKJKI/UG68M9iKxVI/AAAAAAAAF1Q/Ex7MjOzAn3s/s48/down.png) no-repeat top left;
background-position:50% 50%;
width:30px; /* Button's width */
height:30px; /* Button's height */
bottom:242px; /* Distance from the bottom */
left: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);
}

***Τα κόκκινα γράμματα left προσδιορίζουν οτι θα μπεί αριστερά ...αν θέλετε να το βάλετε δεξιά αντικαταστήστε τη φράση με το right...

Βρείτε μετά τη φράση </head>, και ακριβώς από ΠΑΝΩ - ΠΡΙΝ επικολλήστε τη φράση :

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js' type='text/javascript'></script>

Κατόπιν βρείτε τη φράση </body> και επικολλήστε ΠΑΝΩ - ΠΡΙΝ από αυτή, τη παρακάτω φράση :

<div class='button_up' id='button_up' style='display:none;'></div>
<div class='button_down' id='button_down' style='display:none;'></div>
<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');
$('#button_up').fadeIn('slow');
$('#button_down').fadeIn('slow');
$(window).bind('scrollstart', function(){
$('#button_up,#button_down').stop().animate({'opacity':'0.2'});
});
$(window).bind('scrollstop', function(){
$('#button_up,#button_down').stop().animate({'opacity':'1'});
});
$('#button_down').click(
function (e) {
$('html, body').animate({scrollTop: $elem.height()}, 800);
} );
$('#button_up').click(
function (e) {
$('html, body').animate({scrollTop: '0px'}, 800);
} );});
//]]>
</script>

Πατήστε "ΑΠΟΘΗΚΕΥΣΗ" και είσαστε έτοιμοι....
ΚΑΛΗ ΕΠΙΤΥΧΙΑ !!!