Кнопка наверх как Вконтакте
Благодаря jQuery сейчас как никогда просто реализовать такие вещи, работающий пример можно посмотреть здесь, а код ниже:
Первым делом надо подключить jQuery, как это сделать рассказывать не буду
CSS:
a#move_up { position: fixed; left:10px; top: 10px; width: 90px; height: 21px; display: none; text-align: center; font: 12px Verdana; text-decoration: none; color: #2b587a; background: #e1e7ed; padding-top:5px; opacity:0.8; filter: alpha(opacity=80); } a#move_up:hover { color: #fff; background: #597da3; }
Javascript:
$(function () { $(window).scroll(function () { if ($(this).scrollTop() > 100) { $('a#move_up').fadeIn(); } else { $('a#move_up').fadeOut(400); } }); $('a#move_up').click(function () { $('body,html').animate({ scrollTop: 0 }, 800); return false; }); });
И код самой кнопки:
▲ Наверх
выпускные прически афиша для детей
проект f 056 1
приемное устройство для зерна
Запись опубликована @amxm.Вы можете оставить комментарии здесь или тут