Круглая кнопка вверх в 6 вариантах
 | |
| И так когда вы создали свой сайт и начали его заполнять контентом и материалом, то безусловно вам нужен скрипт кнопка верх которая и будет выполнят за вас эту функцию. И так с этим мы разобрались, теперь нам нужно подобрать ту кнопку которая подходила бы к вашему дизайну. Их будет шесть, вам только нужно скопировать и прописать ссылку в код, который нужно будет установить. И чтоб при клике немного кнопка менялась и показывала что вы навели на ее, нам еще нужно будет прописать небольшой стиль, но все по порядку. Копируем этот код и прописываем в низ вашего сайта, перед /body и сохраняем. Код <a href="#" class="top-button"><img alt="наверх" src="http://zornet.ru/CSS-ZORNET/vaccser/ds/top_button1.png" /></a> <script type="text/javascript"> $(function(){$.fn.scrollToTop=function(){$(this).hide().removeAttr("href");if($(window).scrollTop()!="0"){$(this).fadeIn("slow")}var scrollDiv=$(this);$(window).scroll(function(){if($(window).scrollTop()=="0"){$(scrollDiv).fadeOut("slow")}else{$(scrollDiv).fadeIn("slow")}});$(this).click(function(){$("html, body").animate({scrollTop:0},"slow")})}}); $(function() { $(".top-button").scrollToTop(); }); </script> Потом идем в CSS и нужно поставить этот стиль: Код /* Кнопка наверх ------------------------------------------*/ .top-button { margin:0px; padding:0px; position:fixed; cursor: pointer; bottom:25px; right:50px; } На этом все, теперь нам просто нужно выбрать саму кнопку, так как по умолчанию в коде стоит темная.       Источник: www.uotvet.ru | |
Поделиться в социальных сетях
Материал разместил
| Комментарии: 6 | |
несколько мес.назад я вообще не знал что все это существует
 
| |
