Кнопка вверх и вниз в синем цвете
Очень удобная кнопка у которой состоят функций при нажатие на ее она подымает страницу и так же ее опускает при нажатие стрелки в низ. Создана была под светлый дизайн сайта. Но не факт что она и на темный не подойдет. Просто не проверено. Она будит располагаться в правом нижнем углу монитора или сайта как вам удобней. Установка скрипта: Все коды а их два, они будут в нижней части сайта. Начнем с первого, его прописываем в низ сайта. Код <script type="text/javascript"> jQuery(function(){ $("#Go_Top").hide().removeAttr("href"); if ($(window).scrollTop()>="200") $("#Go_Top").fadeIn("slow") $(window).scroll(function(){ if ($(window).scrollTop()<="200") $("#Go_Top").fadeOut("slow") else $("#Go_Top").fadeIn("slow") }); $("#Go_Bottom").hide().removeAttr("href"); if ($(window).scrollTop()<=$(document).height()-"999") $("#Go_Bottom").fadeIn("slow") $(window).scroll(function(){ if ($(window).scrollTop()>=$(document).height()-"999") $("#Go_Bottom").fadeOut("slow") else $("#Go_Bottom").fadeIn("slow") }); $("#Go_Top").click(function(){ $("html, body").animate({scrollTop:0},"slow") }) $("#Go_Bottom").click(function(){ $("html, body").animate({scrollTop:$(document).height()},"slow") }) }); </script> И сразу где прописали первый код, под ним прописываем и второй, это будит код с кнопкой. Код <a style='position: fixed; bottom: 60px; right: 1px; cursor:pointer; display:none;' href='#' id='Go_Top'> <img src="http://zornet.ru/CSS-ZORNET/ZR/up_vverkh.png" alt="Вверх" title="Вверх"> </a> <a style='position: fixed; bottom: 20px; right: 1px; cursor:pointer; display:none;' href='#' id='Go_Bottom'> <img src="http://zornet.ru/CSS-ZORNET/ZR/down_vniz.png" alt="Вниз" title="Вниз"> </a> |
Поделиться в социальных сетях
Материал разместил
Комментарии: 2 | |
| |