вопрос
Как сделать такуюже как на вашем сайте, плавающую кнопку "наверх".
Говорят, что где-то уже отвечали, но я не нашёл.
Говорят, что где-то уже отвечали, но я не нашёл.
Да, отвечали в комментариях, но это было до переработки сайта и они не сохранились.
Собственно сама кнопка - это доработанный скрипт плавающей панели с соц.закладками, только без соцзакладок
Вставляем это в любой js-файл, можно в начало, можно в конец, как душе угодно:
где #wrapper - это блок, после которого будет вставлен код кнопки.
Теперь CSS
Вот собственно и всё.
Собственно сама кнопка - это доработанный скрипт плавающей панели с соц.закладками, только без соцзакладок
Вставляем это в любой js-файл, можно в начало, можно в конец, как душе угодно:
$(function () {
/*Блок-кнопка для перехода к верху страницы*/
var m1 = 310; // расстояние от начала страницы до плавающей панели
var m2 = 300; //расстояние от верха видимой области страницы до плавающей панели (должно быть меньше чем m1)
$("#wrapper").append('<div id="gotop"><a href="#"/></a></div>');
var s = $('#gotop');
s.css({top: m1}).hide();
function margin() {
var top = $(window).scrollTop();
if (top+m2 < m1) {
s.css({top: m1-top}).fadeOut(400);
} else {
s.css({top: m2}).fadeIn(400);
s.find('a').css({opacity: 0.8});
}
}
$(window).scroll(function() { margin(); })
s.hover(
function() { $(this).find('a').css({opacity: 1}); },
function() { $(this).find('a').css({opacity: 0.8}); }
);//конец блока перехода к началу страницы
});где #wrapper - это блок, после которого будет вставлен код кнопки.
Теперь CSS
#gotop {
position: fixed;
z-index: 1000;
margin-left: 995px; /*позиция блока с кнопкой*/
}
#gotop a {
display: block;
width: 41px;
height: 40px;
background: url(../images/upto.png) no-repeat center center; /*нужная картинка*/
}Вот собственно и всё.
