Достаточно простая кнопка НАВЕРХ, которая необходима на каждом сайте с большим количеством объемного контента. Кнопка является копией кнопки с сайта ВКонтакте, то есть она сделана по тому же принципу.
Установка: Перед ставим данный код:
Code
<a style="display:none;position:fixed;height:100%;width:150px;top:40;" href="javascript://" id="toDown"> <b style="color:#888;padding-left:15px;">Вниз</b> </a>
<a style="display:none;position:fixed;height:100%;width:150px;top:40;" href="javascript://" id="toTop"> <b style="color:#888;padding-left:15px;">Наверх</b> </a>
<script>
$(window).scroll(function(){
if($(window).scrollTop() > "300"){
$('#toTop').fadeIn();
$('#toDown').hide();
}else if($(window).scrollTop() == "0"){
$('#toTop').fadeOut();
$('#toDown').fadeIn();
}
});
$('#toTop').click(function(){
$('html, body').animate({scrollTop:0}, 350);
$('#toDown').fadeIn();
});
$('#toDown').click(function(){
$('html, body').animate({scrollTop:$('body').height()}, 350);
$('#toDown').fadeOut();
});
</script>
<a style="display:none;position:fixed;height:100%;width:150px;top:40;" href="javascript://" id="toTop"> <b style="color:#888;padding-left:15px;">Наверх</b> </a>
<script>
$(window).scroll(function(){
if($(window).scrollTop() > "300"){
$('#toTop').fadeIn();
$('#toDown').hide();
}else if($(window).scrollTop() == "0"){
$('#toTop').fadeOut();
$('#toDown').fadeIn();
}
});
$('#toTop').click(function(){
$('html, body').animate({scrollTop:0}, 350);
$('#toDown').fadeIn();
});
$('#toDown').click(function(){
$('html, body').animate({scrollTop:$('body').height()}, 350);
$('#toDown').fadeOut();
});
</script>
Источник: не указан
0 комментариев