• Уважаемый Гость! Если вы зарегистрировались на нашем форуме, значит вам нужна помощь! Мы всегда рады вам помочь, еще ни один пользователь не получил отказа! Но мы так же нуждаемся в Вашей поддержке. Проект полностью бесплатный, мы не имеем права требовать от вас денег, нам это и не нужно! Но от любой финансовой поддержки не откажемся. Проект развивается, но иногда очень тяжело его поддерживать, особенно в финансовом отношении. Если у вас есть возможность поддержать нас финансово, мы будем вам очень благодарны! С уважением, команда Оскласс Россия!
  • Изменение в правилах форума! В связи с огромным количеством вопросов поступающих в адрес технической поддержки мы решили изменить правила форума! Просим всех пользователей обратить внимание на данные изменения и четко их соблюдать!
  • Ребята, нуждаемся в программистах! Если хотите зарабатывать и есть время, пишите администраторам сайта. Есть база и инструменты, нужен опыт и знания =)
  • Уважаемые пользователи! На форуме появились разделы по работе с системой Yclas. Yclas - это скрипт доски объявлений. Нужны разработчики.

Плавающая кнопка "наверх"

shebalino

Кидала
Приветствую всех.
Для удобства пользователей, было решено установить кнопку "наверх" (возврат наверх страницы одним кликом).
Как реализовать подобное на всех страницах сайтах?
Заранее спасибо
 

administrator

Блудный сын.
Команда форума
Примерно перед закрывающим тегом </body> вставьте код:
Код:
(function($){

   /* использование: <a class='scrollTop' href='#' style='display:none;'></a>
   ------------------------------------------------- */
   $(function(){
	 var e = $(".scrollTop"),
	 speed = 500;

	 e.click(function(){
	   $("html:not(:animated)" +( !$.browser.opera ? ",body:not(:animated)" : "")).animate({ scrollTop: 0}, 500 );
	   return false; //важно!
	 });
	 //появление
	 function show_scrollTop(){
	   ( $(window).scrollTop()>300 ) ? e.fadeIn(600) : e.hide();
	 }
	 $(window).scroll( function(){show_scrollTop()} ); show_scrollTop();
   });

})(jQuery)
В хедере вот этот код:
Код:
	<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
В стили:
Код:
.scrollTop{ 
	background:url(путь_до_файла/arrows2.png) 0 0 no-repeat; 
	display:block; width:50px; height:50px; 
	position:fixed; bottom:10px; left:47%; 
	z-index:2000; 
} 
.scrollTop:hover{ background-position:0 -58px; }
Для появлении кода на странице вставляем картинку, можно прямо в футер через код:
Код:
<a class='scrollTop' href='#' style='display:none;'></a>
Вот пример картинки:
arrows2.png

Источник статьи.
 
Верх