Боковая панель "Вверх" как вконтакте для uCoz

4073
10 из 10
Проголосовало: 4






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

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

Установка:

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

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>
Автор публикации: Загрузка
Загрузка
Вовчик, это его n материал
Источник: http://www.apo-ucoz.com/
  • Всего комментариев: 13

myglaz
0
myglaz написал: Написано 23 Января 2014 в 12:32
Комментарий №13
Не работает,кнопка есть,но толку нету не поднимает вверх

FoGame
0
FoGame написал: Написано 10 Марта 2012 в 12:26
Комментарий №12
Супер..!

I-vashka
0
I-vashka написал: Написано 25 Февраля 2012 в 18:13
Комментарий №11
В общем эта хрень не работает как надо.

I-vashka
0
I-vashka написал: Написано 25 Февраля 2012 в 11:15
Комментарий №10
Точнее работает, а вот самой панели нет))) наверно слишком прозрачный див happy

I-vashka
0
I-vashka написал: Написано 25 Февраля 2012 в 11:12
Комментарий №9
Странно, но не работает... wacko

KiruxAable
0
KiruxAable написал: Написано 23 Февраля 2012 в 22:53
Комментарий №5
А как цвет слова "Вверх" Изменить??? cry

Вовчик
+1
Вовчик написал: Написано 23 Февраля 2012 в 22:54
Комментарий №6
мой мозг сума сошёл

Вовчик
+1
Вовчик написал: Написано 23 Февраля 2012 в 23:02
Комментарий №7
KiruxAable, может для тебя видео урок сделать?

BlackPh
+1
BlackPh написал: Написано 24 Февраля 2012 в 00:09
Комментарий №8
Чувачок замени color:red; на color:цвет; biggrin

Iverson
0
Iverson написал: Написано 22 Февраля 2012 в 17:46
Комментарий №4
Не надоело копировать контакт???

Ринат
0
Ринат написал: Написано 22 Февраля 2012 в 16:53
Комментарий №3
Классный скриптик

Mr_Scratch
+1
Mr_Scratch написал: Написано 22 Февраля 2012 в 11:03
Комментарий №2
Шыкарный скрипт! на темный дизайнах бомбезно смотрится biggrin

lTeHbl
0
lTeHbl написал: Написано 22 Февраля 2012 в 09:26
Комментарий №1
Жалко что на DLE не работает, вообще даже оформление, только на гугл хром оформление, но не прокручиваеться

  • Оставить комментарий:
Добавлять комментарии могут только зарегистрированные пользователи.
Регистрация | Вход
Меню сайта
Категории
Для помощи создания сайта uCoz 25
Скрипты и модификации для Ucoz 2118
Шаблоны форумов Ucoz 28
Шаблоны сайтов Ucoz 431
Авторство Webo4ki 309
php скрипты для ucoz 57
Графика для uCoz 40
Мини-чат
Последние комментарии
  • Marishka написал:
  • Радио не стоит на месте новая версия вам 1.5:
    Что нового:
    1. Media Session - позволит вам переключать из бара браузера радио, а также на блоке экрана.
    2. Новые радиостанции.
    3. Новый API код.

    Демо: fiddle
    Реальная полная версия: woobl
  • Marishka написал:
  • Можете добавить свои input поля, но сохраняйте их порядок в html для правильного сохранения и вывода.
  • Marishka написал:
  • Новая версия 1.3 (+6 новых станций):
    Установка:
    Демо: Перейти
  • Marishka написал:
  • Доп 8 станций:
    Код
    <div class="mSt"><p>Tropical</p><div data="2/trop_64">64</div><br><div data="2/trop_128">128</div><br><div data="2/trop_320">320</div></div>  
      <div class="mSt"><p>Нафталин FM</p><div data="2/naft_64">64</div><br><div data="2/naft_128">128</div><br><div data="2/naft_320">320</div></div>  
      <div class="mSt"><p>Rave FM</p><div data="2/rave_64">64</div><br><div data="2/rave_128">128</div><br><div data="2/rave_320">320</div></div>  
      <div class="mSt"><p>Gold</p><div data="2/gold_64">64</div><br><div data="2/gold_128">128</div><br><div data="2/gold_320">320</div></div>  
      <div class="mSt"><p>GOA/PSY</p><div data="2/goa_64">64</div><br><div data="2/goa_128">128</div><br><div data="2/goa_320">320</div></div>  
      <div class="mSt"><p>Minimal/Tech</p><div data="2/mini_64">64</div><br><div data="2/mini_128">128</div><br><div data="2/mini_320">320</div></div>  
      <div class="mSt"><p>House</p><div data="2/fut_64">64</div><br><div data="2/fut_128">128</div><br><div data="2/fut_320">320</div></div>  
      <div class="mSt"><p>Megamix</p><div data="2/mix_64">64</div><br><div data="2/mix_128">128</div><br><div data="2/mix_320">320</div></div>


    Fix работы радио:
    Находим: if(radUrl=="tm" || radUrl=="ps" || radUrl=="teo" || radUrl=="dc")
    Меняем на: if (radUrl == "tm" || radUrl == "ps" || radUrl == "teo" || radUrl == "dc" || radUrl == "gop")
  • CbIPoK2513 написал:
  • Мой вариант выдаёт аватарку картинкой, а не текстом.
    Последние темы
    Опрос
    259
    А
    Р
    Что произойдёт: $("#...
    Статистика
    Анализ интернет сайта
    0
    онлайн
    0
    наших
    0
    чужих
    Онлайн всего: 1
    Гостей: 1
    Пользователей: 0
    0
    Сегодня были
    Топ пользователей: