Сегодня Пятница | Дата: 29.03.2024 | Время:
zdq players group
Здравствуй Гость! Авторизуйся или зарегистрируйся.
Новые сообщения · Участники · Правила форума · Поиск · RSS
  • Страница 1 из 1
  • 1
Форум » Всё для uCoz » Скрипты для uCoz » Боковая панель "Вверх" как вконтакте для uCoz (Шыкарный скрипт)
Боковая панель "Вверх" как вконтакте для uCoz
BatareykaДата: Суббота, 31.03.2012, 04:37 | Сообщение # 1
Группа: Пользователи
Сообщений: 9
Шыкарный скрипт! на темный дизайнах бомбезно смотрится

Так выглядит скрипт: http://s44.radikal.ru/i105/1203/90/7b504a2e4f2d.jpg

Идея данного скрипта была взята с социальной сети Вконтакте

Суть скрипта заключается в том, что по мере прокрутки страницы справа постепенно становится непрозрачной кнопка вверх. При наведении на правую крайнюю область страницы весь блок кнопки становится кликабельным и клик по ней плавно проскроллит страницу в самый верх

Установка:
В любой глобальный блок в самый низ:

Code
<style>     
     #aposcroll a {     
     text-decoration:none;     
     color:red;     
     }     

     #aposcroll:hover {     
     background-color:rgba(200, 200, 200, 0.7);     
     box-shadow:0px -5px 10px #777;     
     }     
     </style>     
     <div style="padding:30px 5px 0px 5px;position:fixed;top:0px;right:0px;z-index:999;width:70px;height:100%;opacity:0" id="aposcroll"><center><a href="javascript://">▲ Вверх</a></center></div>     

     <script>     
     // Кнопка Вверх by Apocalypse     
     var as = $('#aposcroll');     
     as.click(function() {     
     $(document).scrollTo(0, 500);     
     });     
     document.onscroll = function() {     
     var apolst = '0.'+$('body').scrollTop();     
     if(apolst.length == 5) {     
     as.stop().fadeTo(500, apolst);     
     } else if(apolst.length == 4 || apolst.length == 3) {     
     as.stop().fadeTo(500, 0);     
     };     
     };     
     // apo-ucoz.com (c) 2012     
     </script>
 
Форум » Всё для uCoz » Скрипты для uCoz » Боковая панель "Вверх" как вконтакте для uCoz (Шыкарный скрипт)
  • Страница 1 из 1
  • 1
Поиск:

Design by: NordHeRn ®