Вторник, 26.11.2024, 14:51
Приветствую Вас Гость | RSS
Главная | | Регистрация | Вход
Поиск
Меню сайта
Календарь
«  Сентябрь 2012  »
ПнВтСрЧтПтСбВс
     12
3456789
10111213141516
17181920212223
24252627282930
Статистика

Онлайн всего: 12
Гостей: 12
Пользователей: 0
Стальные двери Межкомнатные двери
Master script
Главная » 2012 » Сентябрь » 6 » jQuery для начинающих. Вводный урок.
08:48
jQuery для начинающих. Вводный урок.

jQuery - это одна из библиотек JavaScript'а, но несмотря на это я выделил ее в отдельную категорию на своем сайте, т.к. с помощью этой библиотеке можно такую красоту на сайте навести, что просто ВАХ!

С помощью jQuery можно делать красивую анимацию на сайте, быстро обрабатывать различные события, например, клик мышкой или ввод информации в текстовое поле, так же jQuery помогает в работе с AJAX.

Все, что можно написать на jQuery можно и написать на обычном javaScript'е, но jQuery и придумали, чтобы облегчить работу веб-мастерам.

Начинаем работать с jQuery

Для начала скачайте либо с моего сайта, либо с официального сайта последнюю версию библиотеки (скачать тут). (Если Вы скачали с официального сайта, то переименуйте файл в jquery.js)
Затем нужно вставить к себе в страницу между тегами <head></head> строчку:

<script type="text/javascript" rel="lightbox" src="/jquery.js"></script>

Для того, чтобы Ваш скрипт начал работать его нужно поместить в такую конструкцию:

$(document).ready(function(){
//Code here
});

А теперь давайте попробуем написать свой первый скрипт на jQuery:

 <script type="text/javascript">

$(document).ready(function(){
var myQuote = $('#my_quote');
myQuote.hide();
$('.button').click(function(){
myQuote.show(500);
});
});
</script>

Теперь немного конкретики:

1) Помещаем весть код в функцию  $document.ready().
2) Присваиваем переменной my_quote id нашей цитаты.
3) Прячим текст с помощью метода "hide".
4) На кнопку с классом "button" задаем интервал времени в который будет выезжать цитата. В данном примере она будет выезжать 0.5 секунды.

Чтобы более детально разобрать этот пример, Вы можете скачать его к себе на компьютер локально.

Пример урока можете посмотреть здесь

Прикрепленный файлРазмер
Вводный урок19.45 кб
jquery.js18.81 кб
Просмотров: 378 | Добавил: koks1983 | Теги: уроки JQuery | Рейтинг: 0.0/0
Всего комментариев: 0
Имя *:
Email *:
Код *:
Конструктор сайтов - uCozMaster script. © 2024
                                                                             Яндекс.Метрика