Кнопка вверх с плавным скольжением для uCoz
Это простая кнопка вверх, которое имеет плавное скольжение поднятие страницы. Что по умолчанию стоять будет в правом нижнем углу. Безусловно сейчас в сети можно найти совершенно разные кнопки, что созданы на CSS. В нашем случай все очень просто и привлекаем только файл js и кнопку формате PNG и также GIF. Что должна уже идти по размерам, так как уже не настроить. Но есть один очень полезный ресурс, по созданию уникальный кнопок, что вы сами можете сделать для своего портала. Вот что предоставлена здесь, это там ее сделал. Но как понимаете, можно после создание привлечь фотошоп и нанести на ее градиент, чтоб смотрелось намного ярче. Но это для тех, кому нравится яркие дизайн на своем сайте. Вы выбираете рисунок и потом выстраиваете то изображение, которое вам нужно. С начало хотел поставить что то уникальное, но не стал делать, так как возможно многие не поймут и поставил такую картинку. Так в чем плюс в этом? Это то, что самостоятельно выставляете то изображение, которое вам нужно. Теперь о поднятие вверх, которое реально красивое. И состоит в таких настройках, что плавно разгоняется и где то на половине монитора она просто исчезает, что также будет появляться, если страницу вы опускаете. Так что можно сделать как на яркий дизайн и сам конструктор, где будет фиксированная ширина. Если вы сделаете через через сервис кнопку, то как уже сказано, там идет один оттенок, это тот который вы сами поставите. Но если хотите что свое и наложит уже на созданную кнопку градиент, то здесь фотошоп отличное будет решение, где можно все сделать на высоком уровне. Приступаем к установке: В низ сайта: Код <div style="position:relative"> <a href="javascript://" title="Поднять страницу" style="position: fixed; bottom: 0px; right: 4px; display: block; " id="toTop"> <img src="http://zornet.ru/Aben/ABGEA/Hand-Up-32.png" border="0" title=""></a> </div> <script src="http://zornet.ru/Aben/ABGEA/scrolllingup.js" type="text/javascript"></script> <div style="position:relative"> <div id="scrolling-img" style="position: fixed; top: 48%; left: 45%; z-index: 9999; "> </div> </div> Там стоят проценты, что вы можете отредактировать, это если у вас сильно фиксированный сайт и кнопку нужно вывести, чтоб заметна была. Как пример, можно сделать по размерам, не говоря о том, что в центре будет установлено в плане картинки. Но больше сделал этот материал под статью, что сам веб мастер создавая сайт, ставит все оригинальное, который делает сам. Здесь только как основа идет код на кнопку вверх, который аналогично настраивается. И как дополнение, это изображение. что по клику на его будет происходить работа на поднятие страниц сайта. |
Поделиться в социальных сетях
Материал разместил
Комментарии: 5 | |
| |