|
|
Разработан в ноябре 2005 года
Описание
По щелчку мыши на изображении активного элемента
переключает автоматическую прокрутку страницы.
Удобно также навешивать его и на обработчик нажатия клавиатуры, чтобы переключение происходило по нажатию любой (или
какой-то избранной) клавиши. Полезно использовать при чтении длинных текстов.
Комментарии
Реализован в объектно-ориентированной концепции. Иными словами, вы можете внедрять в свои страницы отдельный класс,
создавать на странице несколько его экземпляров (в данном случае это, кажется, излишне, но все же... ;) ),
настраивать поведение каждого экземпляра при помощи его свойств. Например, вы можете задать каждому из нескольких
созданных вами объектов собственную скорость прокрутки страницы - и пользователь сможет выбирать желаемую
скорость прокрутки страницы путем щелчка мыши на соответствующем экземпляре. Или же вы можете позвоить пользователю
задавать скорость прокрутки при помощи элементов формы, динамически присваивая свойству единственного созданного вами
экземпляра введенное пользователем численное значение.
Пример:
можно увидеть
тут. При нажатии любой клавиши страница будет медленно
прокручиваться вниз. Повторное нажатие клавиатуры остановит страницу и т.д.
Подробное описание
Все, что вам понадобится, - это загрузить готовый модуль, содержащий класс ctrlScroll01
(например, взять его можно отсюда:
src="http://mywebportfolio.avmoskalenko.ru/JSEx/Scrpts05/windows.js"),
и создать экземпляр данного класса:
inst=new ctrlScroll01('Ya');
Обратите внимание, что в конструктор вы передаете его inst.ID,
по которому вы его затем разыщете. Впрочем, если
Вы "забудете" принудительно назначить создаваемому экземпляру ID, констркутор
сгенерирует его автоматически, а вы сможете
узнать его, прочитав inst.ID - свойство созданного экземпляра.
Вы можете даже не запоминать указатель на создаваемый
экземпляр! Потому что этот указатель на созданный экземпляр вы сможете получить через
свойство ctrlScroll01Pointer у соответсвующего тэга! Но все же запомните хоть что-либо одно
- иначе вам придется
разыскивать свой экземпляр по всей коллекции тэгов - а оно вам нужно ли? Итак, экземпляр вы создали - поздравляю.
Затем настраиваете его свойства (полный перечень свойств см. ниже), и вызываете его перерисовку:
inst.Rate=100;
inst.Redraw();
Я настоятельно рекомендую поцепить на клавиатуру метод созданного вами экземпляра switchState.
Сделайте это удобным вам способом. Вот пример самого простого способа:
if (document.BrVer.isID(inst.ID)) {document.onkeypress = new Function('inst.switchState();');}
Обратите внимание, что мы для начала проверяем существование тэга с данным ID. Это полезно делать, дабы избежать
различных жалоб со стороны браузера в случае неуспешности создания нашего экземпляра (по тем или иным причинам).
Да, и еще. Обязательно обратите свое внимание на использование BrVer.
BrVer - это замечательный объект, обладающий целым набором полезных свойств (хотя он и
недоделанный), и без него не будет работать даже класс ctrlScroll01. Поэтому
прежде чем создавать экземпляр класса ctrlScroll01, обязательно загрузите
скрипт src="http://mywebportfolio.avmoskalenko.ru/JSEx/Scrpts05/verify.js", который
автоматически и создаст объект document.BrVer.
Свойства объектов класса ctrlScroll01
ID - ну, я думаю, уже понятно, что это и зачем. Ни в коем случае не изменяйте
значение этого свойства! (Я, к сожалению, еще недокопался, как устанавливать свойства в состояние риид-онли.)
Rate - интервал времени, через который производится шаг прокрутки. По умолчанию
равен 200 миллисекунд;
Step - шаг вертикальной прокрутки в пикселях. По умолчанию равен 1. Есть еще и
шаг горизонтальной прокрутки StepX, который по умолчанию установлен в ноль - и я не знаю,
зачем бы вам могло понадобиться менять его значение 8-?.
Vid - ничего интересного ;). См. подробнее в описании метода
Refresh().
color - задает, естественно, цвета для включенного и выключенного состояния:
color[0] - для выключенного; по умолчанию "blue";
color[1] - для включенного; по умолчанию "red".
textDefault - задает текст для исходного вида экземпляра. Можете установить
свой текст - например, какой-нибудь "Я люблю тебя, Вася!" ;). Пождробнее см. в описании метода
Refresh().
text - задает текст для включенного и выключенного состояния:
text[0] - для выключенного; по умолчанию "Scroll Off";
text[1] - для включенного; по умолчанию "Scroll On ";
Методы объектов класса ctrlScroll01
switchState() - метод, наиболее полезный с точки зрения "прикладного веб-разработчика".
Именно его мы вызываем, чтобы переключить режим скролирования (см пример выше). А уж как и откуда вызывать - решайте
сами :).
Run() - этот метод запускает прокрутку; именно он вызывается из
switchState(). Вы можете вызвать его и сами, однако я не знаю, зачем вам это может понадобится.
Но все же я, на всякий случай, заблокировал повторный вызов этого метода ;).
Stop() - этот метод останавливает прокрутку; именно он вызывается из
switchState(). Вы можете вызвать его и сами, однако я не знаю, зачем вам это может понадобится.
Но все же я, на всякий случай, тоже заблокировал повторный вызов этого метода.
Do() - собственно, это и есть тот самые осел, который тянет на себе прокрутку.
Вы можете легко переопределить этот метод прямо из кода своей собственной страницы! Заставьте, например, класс
ctrlScroll01 вместо того, чтобы прокручивать страницу, качать левой ногой и ковыряться в носу
:). Ну или можете заставить его делать что-либо более полезное: заставьте этот класс включать и выключать, например,
падание снега на вашей веб-странице или же, например, секундомер.
Redraw() - этот метод вам понадобится лишь один раз (см. выше пример), поскольку
его повторные вызовы заблокированы (точнее, почти заблокированы: метод восстановит "правильное" значение переменной
Vid и затем вызовет метод Refresh() - см. ниже ).
Redraw()следует вызвать сразу же после установления свойства
textDefault (см. выше) - и до (!) каких-либо иных манипулляций с объектом.
Именно этот метод и "рисует" ваш тэг с заданным
ID, а также "навешивает" на этот тэг все необходимые "аксессуары".
Refresh() - этот метод устанавливает вид экземпляра класса
ctrlScroll01 в соответствие со значением переменной Vid.
Делает он это путем вызова метода SetVid(). Вам может захотеться вызвать этот метод для того,
чтобы вернуть экземляру его первоначальный вид - в этом случае устанавливайте Vid в
любое значение, отличное от 0 и 1, и вызывайте метод Refresh(). Обратите внимание,
что если вы в данном случае вызовите Redraw() вместо Refresh(),
то переменная Vid автоматически установится в значение, соответствующее реальному состоянию
экземпляра!
SetVid() - именно этот метод и выполняет все отрисовки вашего экземпляра класса
ctrlScroll01. Думаю, если вы чувствуете себя достаточно уверенными в программировании на
Джава-скрипте, то вам может захотеться переопределить этот метод, дабы перерисовка была еще более симпатичной :).
Успехов!
|
