script.aculo.us
| script.aculo.us | |
| Файл:Scriptaculous logo.png | |
| Тип | JavaScript-библиотека |
| Разработчик | Thomas Fuchs |
| ОС | Кроссплатформенное ПО |
| Версия | 1.8.2 (18 ноября, 2008) |
| Лицензия | MIT License |
| Сайт | script.aculo.us |
script.aculo.us — JavaScript-библиотека для разработки пользовательского интерфейса веб-приложений, построенная на фреймворке Prototype.
Обычно используется программистами вместе с Ruby on Rails, однако также доступен в виде отдельной библиотеки, и присутствует в составе некоторых других каркасов для разработки сайта.
Был создан Томасом Фукс в процессе работы над веб-интерфейсом инструмента цифрового управления активами Fluxiom компании Wollzelle[1], впервые был опубликован в июне 2005 года.
Возможности
script.aculo.us использует Prototype в качестве фундамента и добавляет усовершенствованные методы работы с AJAX-запросами, класс под названием Builder для манипуляций с DOM-элементами, а также инструменты для создания специальных эффектов любой сложности.
Визуальные эффекты
Существуют пять основных эффектов script.aculo.us: Opacity, Scale, MoveBy, Highlight, и Parallel. Кроме них насчитывается более 16 дополнительных эффектов, которые подключаются с помощью дополнительных модулей. Программисты могут также расширить список новыми эффектами.
Для активации эффекта необходимо указать идентификатор элемента ID и одну строку кода с указанием необходимой функции. Ниже приведен пример для функции Effect.Fade, применяемой к DOM-элементу с идентификатором 'id_of_element'. Этот код приведёт к постепенному исчезновению (увеличению прозрачности) элемента, вплоть до полной невидимости с помощью CSS стиля display:none.
<source lang="javascript">
new Effect.Fade('id_of_element');
</source>
Также можно указать параметры эффекта: продолжительность и границы воздействия. Следующий пример приведёт к увеличению прозрачности элемента с остановкой на 80 % полного эффекта (с прозрачностью 20 %). <source lang="javascript"> new Effect.Fade('id_of_element', { duration:2.0, from:0.0, to:0.8 }); </source>
Класс Builder
Builder позволяет динамически создавать DOM-элементы. Использование образца кода ниже: <source lang="javascript"> element = Builder.node('div',{id:'ghosttrain'},[
Builder.node('div',{className:'controls',style:'font-size:11px'},[
Builder.node('h1','Ghost Train'),
"testtext", 2, 3, 4,
Builder.node('ul',[
Builder.node('li',{className:'active', onclick:'test()'},'Record')
]),
]),
]); </source> создаёт следующий код (без переносов строк): <source lang="html4strict">
Ghost Train
testtext234
- Record
</source>
Использование
Включение script.aculo.us в веб-сайт требует копирования всех javascript-файлов и добавления следующих строк в начало HTML-документа: <source lang="html4strict"> <script src="javascripts/prototype.js" type="text/javascript"></script> <script src="javascripts/scriptaculous.js" type="text/javascript"></script> </source>
Эти скрипты должны быть загружены перед любым вызовом функций Prototype или script.aculo.us. После загрузки функции библиотек можно вызвать в любом javascript-теге, в том числе и в обработчиках событий.
Источники
См. также
Ссылки
Примеры на русском языке
| Программирование | Это незавершённая статья о программировании. Вы можете помочь проекту, исправив и дополнив её. |
Инструментарии виджетов |
|||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
уровневые |
Macintosh Toolbox/Carbon · Windows API · Intrinsics · Intuition · Xlib | ||||||||||||||||||||
уровневые |
| ||||||||||||||||||||
de:Script.aculo.us en:Script.aculo.us es:Script.aculo.us it:Script.aculo.us pl:Script.aculo.us tr:Script.aculo.us
Если вам нравится SbUP.com Сайт, вы можете поддержать его - BTC: bc1qppjcl3c2cyjazy6lepmrv3fh6ke9mxs7zpfky0 , TRC20 и ещё....
