Страница 1 из 5

Плавная прокрутка 2(стрелка вверх)

Добавлено: 16 янв 2012, 23:25
DeaDRoMeO
Введение

В одной из тем данного раздела я рассматривал уже плавную прокрутку вниз и вверх. Сегодня хочу поделиться новым найденным скриптом для этого дела. Он малость отличается от рассмотренного ранее тем, что у него отсутствует стрелка вниз. Работает он следущим образом - когда пользователь находится вверху страницы форума, то стрелка скрыта, но стоит ему немного прокрутить страницу вниз, как плавно появляется стрелочка, в правом нижнем углу монитора, при нажатии на которую, страница плавно прокручивается до самого верха. Впринципе потестировать данный скрипт вы можете и на нашем форуме.
Установка

Установка так же проще некуда, скачиваем архив и распаковываем единственный скрипт в корень форума, а так же находим красивую стрелочку, называем ее arrow_up.png и так же ложим в корень форума.
scrolltopcontrol.rar
Скрипт плавной прокрутки для форума phpbb3
(1.68 КБ) 297 скачиваний
После открываем файл /styles/ваш стиль/template/overall_header.html и находим следущий код(инструкция будет доступна тем, кто набрал 10 сообщений на нашем Форуме) Добавляем перед

Код: Выделить всё

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="scrolltopcontrol.js"></script>
После всех правок не забываем чистить кеш в админке и радоваться результатам :?
Для phpBB 3.1 / Ascraeus данный скрипт сконвертирован в расширение, скачать можно

Плавная прокрутка 2(стрелка вверх)

Добавлено: 16 янв 2012, 23:27
mixail
А старую удалять надо.... :x

Плавная прокрутка 2(стрелка вверх)

Добавлено: 16 янв 2012, 23:32
DeaDRoMeO
Разумеется, там и удалять то нечего :smile:

Плавная прокрутка 2(стрелка вверх)

Добавлено: 11 мар 2012, 21:10
rusmiass
Можно еще картинку arrow_up.png и scrolltopcontrol.js вложить в папку, например назовем ее scroll
Далее редактируем файл scrolltopcontrol.js
Строка 12

Код: Выделить всё

controlHTML: '<img src="scroll/arrow_up.png" style="width:38px; height:38px" />', //HTML for control, which is auto wrapped in DIV w/ ID="topcontrol"
т.е. добавили scroll/
и...
Строка 59

Код: Выделить всё

.attr({title:'Прокрутка Вверх'})
Пишите что хотите вместо Scroll Back to Top ! Лучше на русском языке !
И последнее, то что мы добавили в overal_header.html

Код: Выделить всё

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="scrolltopcontrol.js"></script>
Так же не забываем перед scrolltopcontrol.js" добавить scroll/

Вот и все ! Графическую кнопку, подберите к своему сайту. Просто не люблю я захламлять корень сайта ! А так можно и куда подальше закинуть, на Ваше усмотрение

Плавная прокрутка 2(стрелка вверх)

Добавлено: 11 мар 2012, 22:11
DeaDRoMeO
Пасиба за еще одну инструкцию, я у себя так же делаю обычно - скрипты в одну папку, картинки в другую :co_ol:

Плавная прокрутка 2(стрелка вверх)

Добавлено: 12 мар 2012, 08:25
rusmiass
А Вам спасибо за идею и за скрипт !

Плавная прокрутка 2(стрелка вверх)

Добавлено: 17 июн 2012, 19:17
Roman
Не знаю какая была первая плавная прокрутка (так как её уже на форуме нет), но эта мне нравится. Буду корячиться (то есть устанавливать).
Проще простого некоторым, а мне труднее сложного. Читаю твои пояснения ПО БУКВАМ.

Плавная прокрутка 2(стрелка вверх)

Добавлено: 17 июн 2012, 19:29
DeaDRoMeO
Ну насчет этой прокрутки - то легче некуда, пара строк в один файл и все работает

Плавная прокрутка 2(стрелка вверх)

Добавлено: 28 июн 2012, 21:16
kiev
Всем привет, теперь что флудить надо, что бы посмотреть тему(

Плавная прокрутка 2(стрелка вверх)

Добавлено: 28 июн 2012, 22:32
DeaDRoMeO
Не в обиду сказано - на готовенькое все горазды налететь, а народ надо расшевеливать как то, чтобы и другие прочитав, поняли что это не трудно, потом начнете задавать свои вопросы и получать ответы, народ нынче скромный пошел, взял что надо и ушел, а мне интересно их мнение по поводу скриптов и модификаций, поэтому и скрыты некоторые ключевые моменты дабы раскрепостить новичков

Плавная прокрутка 2(стрелка вверх)

Добавлено: 29 июл 2012, 13:49
estray
мне вот интересно, а можешь сделать этот скрипт чтоб такая же стрелочка была рядом с этой ну и конечно со стрелкой вниз, которая бы проматывала не доконца вниз, а самый лучший вариант к форме ответа) для тех у кого стоит конечно быстрый ответ))))

Плавная прокрутка 2(стрелка вверх)

Добавлено: 29 июл 2012, 13:49
estray
офф топик
я выиграл мани в лотерею, чё сними делать???

Плавная прокрутка 2(стрелка вверх)

Добавлено: 30 июл 2012, 08:42
DeaDRoMeO
estray писал(а):а можешь сделать этот скрипт чтоб такая же стрелочка была рядом с этой ну и конечно со стрелкой вниз,
Вот есть скрипт - http://hello-vitebsk.ru/viewtopic.php?f=144&t=606 -- но это нельзя так настроить чтобы он докручивал до БО, нужно якоря делать, с этим долго придется разбираться
estray писал(а):я выиграл мани в лотерею, чё сними делать???
Ну это как бы развлекающая составляющая форума, можно в магазине какую нибудь штуку купить, либо в покер поиграть

Плавная прокрутка 2(стрелка вверх)

Добавлено: 25 окт 2012, 12:04
jasiuk
Спасибо за дополнение к форуму, давно думал прикрутить стрелку.

Плавная прокрутка 2(стрелка вверх)

Добавлено: 25 окт 2012, 12:34
DeaDRoMeO
Всегда пожалуйста, рад, что не только мне пригодился этот скрипт))

Плавная прокрутка 2(стрелка вверх)

Добавлено: 28 окт 2012, 20:15
ashat
тоже взял ))) пасибо

Плавная прокрутка 2(стрелка вверх)

Добавлено: 28 окт 2012, 22:00
Лена
И у меня получилось. Спасибо :ki_ss:

Плавная прокрутка 2(стрелка вверх)

Добавлено: 28 окт 2012, 22:16
DeaDRoMeO
Рад за вас, молодцы))

Плавная прокрутка 2(стрелка вверх)

Добавлено: 15 ноя 2012, 13:37
Alexander
А как изменить координаты расположения стрелки? А то на просильвере неудачно получается, так как стрелка лежит на границе "сообщение" - "белый фон".

Upd: Уже нашел. В файле scrolltopcontrol.js параметры:

Код: Выделить всё

controlattrs: {offsetx:5, offsety:5}

Плавная прокрутка 2(стрелка вверх)

Добавлено: 15 ноя 2012, 17:42
DeaDRoMeO
Пасиба, пригодится))