В хедер.тпл вставить
PHP:
<a style="display:none;position:fixed;height:100%;width:100px;top:15px;" href="javascript://" id="toDown"> <nobr style="color:#888;padding-left:15px;font-weight: bold;"><img src='./images/icons/down.gif' border='0' class='menu_icon2' />Вниз</nobr> </a>
<a style="display:none;position:fixed;height:100%;width:100px;top:15px;" href="javascript://" id="toTop"> <nobr style="color:#888;padding-left:15px;font-weight: bold;"><img src='./images/icons/top.gif' border='0' class='menu_icon2' />Наверх</nobr> </a>
{literal}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript">jQuery.noConflict();</script>
<script>
jQuery(window).scroll(function(){
if(jQuery(window).scrollTop() > "100"){
jQuery('#toTop').fadeIn();
}else{
jQuery('#toTop').fadeOut();
}
});
jQuery('#toTop').click(function(){
jQuery('html, body').animate({scrollTop:0}, 350);
jQuery('#toDown').fadeIn();
});
jQuery('#toDown').click(function(){
jQuery('html, body').animate({scrollTop:jQuery('body').height()}, 350);
jQuery('#toDown').fadeOut();
});
</script>
{/literal}
Картинки:
требует доработки, а именно не срабатывает отмотка вниз до определённого места, мотает сразу до дна и̶ ̶к̶о̶с̶я̶к̶ ̶с̶о̶ ̶с̶к̶р̶ы̶т̶и̶е̶м̶/̶п̶о̶к̶а̶з̶о̶м̶ ̶"̶В̶н̶и̶з̶"̶,̶ ̶е̶с̶л̶и̶ ̶н̶а̶ч̶а̶т̶ь̶ ̶с̶к̶р̶о̶л̶и̶т̶ь̶ ̶в̶р̶у̶ч̶н̶у̶ю.
=====================================================================
Убран косяк со скрытием/показом "Вниз", если начать скролить вручную вниз после подъёма "Вверх".
PHP:
<script>
jQuery.noConflict();
jQuery(window).scroll(function(){
if(jQuery(window).scrollTop() > "300"){
jQuery('#toTop').fadeIn();
jQuery('#toDown').hide();
}else if(jQuery(window).scrollTop() == "0"){
jQuery('#toTop').fadeOut();
jQuery('#toDown').fadeIn();
}
});
jQuery('#toTop').click(function(){
jQuery('html, body').animate({scrollTop:0}, 350);
jQuery('#toDown').fadeIn();
});
jQuery('#toDown').click(function(){
jQuery('html, body').animate({scrollTop:jQuery('body').height()}, 350);
jQuery('#toDown').fadeOut();
});
</script>
=====================================================================
Теперь всё работает!
PHP:
<script>
var iPosition = null;
jQuery.noConflict();
jQuery(window).scroll(function(){
if(jQuery(window).scrollTop() > "300"){
jQuery('#toTop').fadeIn();
jQuery('#toDown').hide();
}else if(jQuery(window).scrollTop() == "0"){
jQuery('#toTop').fadeOut();
jQuery('#toDown').fadeIn();
}
});
jQuery('#toTop').click(function(){
iPosition = jQuery(window).scrollTop();
jQuery('html, body').animate({scrollTop:0}, 350);
jQuery('#toDown').fadeIn();
});
jQuery('#toDown').click(function(){
jQuery('html, body').animate({scrollTop: (iPosition === null ? jQuery('body').height() : iPosition)}, 350);
jQuery('#toDown').fadeOut();
});
</script>
