Правила форума Подписки
Статистика Форума
Последние обновленные темы Самые популярные темы Самые активные Новые участники
OpenXRay 1.6.02+ (1)
Сталкерские иконки группи... (0)
Темно-светлые социальные ... (0)
Светящаяся кнопка rip Бар... (0)
Cмайл вашего настроения д... (0)
У костра (191)
Анекдоты (145)
Города (94)
Обновление сайта (67)
Создание НПС (63)
StraNNik (1321)
RamzeS (523)
Каратель (178)
Narkostalker (127)
Кракен (93)
sej963821 (14.09.2019)
danilov380 (13.09.2019)
gusarowdemon (05.09.2019)
belarusgames7 (26.08.2019)
kapitonovleon2003 (24.08.2019)
  • Страница 1 из 1
  • 1
Форум[S-R] | Развлекательный форум » Мастерская портала » Скрипты » Разное » Скроллбар по "экрану" (Rip by Бармен)
Скроллбар по "экрану"
StraNNik
StraNNik
Пропуск №: 1
Регистрация: 20.11.2013
Ранг: Легенда
Сообщений: 1321
Карма: 28 | Хабар: 10
Слышу гимн зашитых ртов
Дата: Среда, 20.02.2019, 17:51/ Сообщение №: 1


Рипал: Бармен


[greentable][/greentable]


Вставляем в Нижнею часть сайта в самый низ:

Код
<div id="pageuserscroll">
   <ul>
      <li>
         <div class="page-top" title="Наверх" style="display: block;">top</div>
      </li>
      <li>
         <div class="page-up" title="Предыдущий экран" style="display: block;">up</div>
      </li>
      <li>
         <div class="page-down" title="Следующий экран" style="display: block;">down</div>
      </li>
      <li>
         <div class="page-bottom" title="Вниз" style="display: block;">bottom</div>
      </li>
   </ul>
</div>

CSS:

Код
#pageuserscroll {
     bottom: 36px;
     height: 154px;
     overflow: hidden;
     position: fixed;
     right: 0;
     width: 41px;
     z-index: 200;
}
#pageuserscroll ul {
     list-style-type: none;
     margin: 0;
     padding: 0;
}
#pageuserscroll ul li {
     display: block;
     height: 36px;
     margin-bottom: 3px;
     width: 41px;
}
#pageuserscroll .page-top {
     background: rgba(0,0,0,0) url(/templates/biz-ideas/images/nav-top.png) no-repeat scroll 0 0;
     display: none;
}
#pageuserscroll .page-up {
     background: rgba(0,0,0,0) url(/templates/biz-ideas/images/nav-up.png) no-repeat scroll 0 0;
     display: none;
}
#pageuserscroll .page-down {
     background: rgba(0,0,0,0) url(/templates/biz-ideas/images/nav-down.png) no-repeat scroll 0 0;
     display: none;
}
#pageuserscroll .page-bottom {
     background: rgba(0,0,0,0) url(/templates/biz-ideas/images/nav-bottom.png) no-repeat scroll 0 0;
     display: none;
}
#pageuserscroll ul li div {
     color: #666;
     cursor: pointer;
     display: block;
     height: 36px;
     overflow: hidden;
     text-align: center;
     text-indent: -9000px;
     width: 41px;
}

JS (в нижнею часть сайта):

Код
<script type="text/javascript">
$(document).ready(function() {
    $('<div id="pageuserscroll"><ul><li><div class="page-top" title="Наверх">top</div></li><li><div class="page-up" title="Предыдущий экран">up</div></li><li><div class="page-down" title="Следующий экран">down</div></li><li><div class="page-bottom" title="Вниз">bottom</div></li></ul></div>').appendTo($('body'));
    if ($(window).scrollTop() < 200) {
        $('#pageuserscroll .page-bottom, #pageuserscroll .page-down').fadeIn();
    } else {
        $('#pageuserscroll .page-up, #pageuserscroll .page-top').fadeIn();
    }
    $('#pageuserscroll li div').click(function() {
        var currentScroll = $(document).scrollTop();
        if ($(this).hasClass('page-top')) {
            $('html, body').animate({
                scrollTop: $("body").offset().top
            }, 400);
        }
        if ($(this).hasClass('page-bottom')) {
            $('html, body').animate({
                scrollTop: $(window).scrollTop() + $(document).height()
            }, 400);
        }
        if ($(this).hasClass('page-up')) {
            $('html, body').animate({
                scrollTop: currentScroll - $(window).height()
            }, 400);
        }
        if ($(this).hasClass('page-down')) {
            $('html, body').animate({
                scrollTop: currentScroll + $(window).height()
            }, 400);
        }
    });
    $(window).scroll(function() {
        if ($(this).scrollTop() >= $(window).height() / 2) {
            $('#pageuserscroll .page-up, #pageuserscroll .page-top').fadeIn();
        } else {
            $('#pageuserscroll .page-up, #pageuserscroll .page-top').fadeOut();
        }
        if ($(this).scrollTop() >= $(document).height() - $(window).height()) {
            $('#pageuserscroll .page-up, #pageuserscroll .page-top').fadeIn();
            $('#pageuserscroll .page-bottom, #pageuserscroll .page-down').fadeOut();
        } else if ($(this).scrollTop() >= $(document).scrollTop() - ($(window).height() / 2)) {
            $('#pageuserscroll .page-bottom, #pageuserscroll .page-down').fadeIn();
        }
    });
});
</script>



Тихо на улице, пусто в квартире..Спасибо реактору №4

Форум[S-R] | Развлекательный форум » Мастерская портала » Скрипты » Разное » Скроллбар по "экрану" (Rip by Бармен)
  • Страница 1 из 1
  • 1
Поиск:

Авторское право на игру и использованные в ней материалы принадлежат GSC Game World.
Любое использование материалов сайта возможно только с разрешения его администрации!
Для корректного отображения сайта, рекомендуем использовать обновленный Yandex.Browser
Powered by StraNNik | Хостинг от uCoz | Рекомендуем AdGuard
© 20.11.2013-15.09.2019