Анімоване слайдшоу за допомогою jQuery
Якщо є таке рішення, яке ніколи не вийде з моди - так це швидше за все слайдшоу за допомогою jQuery.
У сьогоднішньому уроці ми створимо класичне слайдшоу із використанням іншого типу зміни слайдів.
Структурування слайдшоу
Насамперед нам необхідно створити структуру. Для правильної роботи нам знадобиться кілька додаткових плагінів, а саме easing для плавних переходів та timing slide changes для зміни слайдів за часом.
Наші елементи слайдшоу будуть у спеціально створеному невпорядкованому списку.
CSS
Наші зображення формують прямокутник із двома картинками по вертикалі та горизонталі. Нам необхідно, щоб відображалося лише одне зображення за 1 раз і тому ми обмежуємо за допомогою стилів видиму зону до 960 пікселів завширшки та 350 пікселів за висотою.
jQuery
Головне завдання jQuery це координація показу слайдів у заданому порядку із зазначенням правильних координат наших зображень.
Код починається з визначення 2-х змінних. Перша ( current_panel ) використовуватиметься для відстеження поточного положення слайдшоу. Друга (animation_duration) - тривалість анімації.
Ось наша панель і готова! Всього доброго! всім удачі!
Даний урок підготовлений для вас командою сайту ruseller.com Джерело уроку: www.buildinternet.com Переклав: Максим Шкурупій Урок створено: 12 Лютого 2010 Переглядів: 45724 Правила передруку
5 останніх уроків рубрики "jQuery"
Анімація набір тексту на jQuery
Сьогодні ми хотіли б вам розповісти про бібліотеку TypeIt — безкоштовний jQuery плагін. З її допомогою можна імітуватинабір тексту. Якщо все налаштувати правильно, то можна досягти дуже реалістичного ефекту.
Тимчасова шкала на jQuery
jQuery плагін для створення тимчасової шкали.
Малюємо діаграму Ганта
jQuery плагін для створення діаграми Ганта.
AJAX та PHP: завантаження файлу
Приклад того, як здійснити завантаження файлу через PHP і jQuery ajax.