jQuery для чайников | Введение
jQuery для чайников — это цикл статей для начинающих вебмастеров, которые просто хотят использовать библиотеку jQuery на своих сайтах.
Все вы наверняка видели на современных сайтах различные всплывающие или наоборот прячущиеся панели, сайдбары – гармошки, картинки плавно затухающие или скользящие, классные фото-галереи и т.п. Красиво, черт!
В шаблонах WordPress а ля «премиум» уже просто не обходится без слайдера с картинками. Смотрится красиво и стильно. Хочется ведь и в своем шаблоне что-то подобное прикрутить.
Самое простое, конечно же, это взять готовый буржуйский шаблон и банально заменить в нем дизайн на свои каляки-маляки, оставив функционал как есть. Но кто даст гарантию, что шаблон после этого не поплывет? Мало ли где что-нибудь напутали.
Поэтому хотя бы на уровне грамотного пользователя jQuery (не разработчика!) изучить данный предмет стоит. Вот этим и займемся.
Еще раз, для прояснения: в данном цикле статей будет в самой простой и доступной форме показан ряд примеров практического применения библиотеки jQuery, без глубокого вникания в суть происходящих процессов. Кому интересно более детальное изучение предмета — читайте профильные форумы и блоги. Вот несколько ссылок:
1. Статья из Wiki
2. Документация на jQuery-Docs.Ru
3. Сайт разработчиков jQuery
Так как сегодняшний пост озаглавлен словом Введение, то с jQuery мы познакомимся пока что лишь в общих чертах. Чтобы сложилось достаточно простое и внятное понимание, о чем вообще идет речь.
Любой начинающий вебмастер, который уже немного разбирается в верстке и знает про HTML и CSS, также знает или хотя бы слышал про JavaScript.
Говоря упрощенно, это программная часть кода веб-сайта, которая позволяет реализовать те или иные эффекты, недоступные или мало-доступные обычным стилевым фишкам на CSS.
Самый простой пример — отображение текущей даты на сайте или обыкновенных часов. Понятно, что одной лишь версткой тут не справиться. Для этого в страницу сайта внедрялись специальные программые куски кода, или иначе — JavaScript.
Выглядело это достаточно просто. В код веб-страницы вставлялась ссылка на внешний файл скрипта:
<script type="text/javascript" src="clock.js"></script>
Практически точно также мы пристегиваем к странице файл стилей CSS. Это просто.
Другой вариант — непосредственная вставка кода самого скрипта прямо в веб-страницу. Для этого в нужном месте страницы, где предполагалось показывать некую фишку (текущую дату, например), добавлялась следующая конструкция:
<script type="text/javascript">
программный код самого скрипта
</script>
Скриптов этих существует тысячи, на любой вкус и цвет. Поэтому умные люди прикинули, что можно собрать кучно самые эффектные и наиболее используемые плюшки и сложить их в одном месте.
Так появилась специальная библиотека сборник по имени jQuery. Теперь достаточно положить в корневую папку нашего сайта один единственный файл jquery.js и затем выдергивать из него необходимые эффекты в нужных местах страницы. Удобно? Безусловно!
Библиотека эта постоянно совершенствуется и пополняется. Ее свежую версию всегда можно скачать с официального сайта разработчиков jquery.com. На данный момент времени (27.01.2010) свежая версия имеет номер 1.4.1
Сразу же возникает закономерный вопрос: а каким конкретно образом можно указать этой самой библиотеке, где мы хотим прилепить то-то и то-то? Ведь сама она не станет показывать фокусы и раздавать леденцы.
Вот как раз для этого дела вначале нужно более или менее изучить основы CSS, ибо посредством стилей и происходит привязка эффектов из библиотеки к деталям страницы. Но об этом (с живым и шевелящимся примером) в следующем посте.
Enjoy!
jQuery для чайников | Введение
jQuery для чайников | Начальные сведения | Простой слайдер
jQuery для чайников | Эффект линзы | плагин JQzoom
jQuery для чайников | Всплывающая подсказка | Плагин Tooltip