Създаване на невероятно слайдер офис JQuery, уеб-магистърска - за създаване и поддържане на уеб сайтове

Днес ние ще се научи да се създаде прекрасен съдържание плъзгача на JQuery.

Лесно и функционално плъзгача съдържание ще ни помогне във всяка ситуация: необходимо е да се постави снимка, връзка, или само текст? Нашата плъзгача всичко възможно!

Нека да се захванем за работа скоро. Създаване на проста оформление за нашия слайдер:

Всичко е просто. Разделение клас = "пързалка" - блок, в който съдържанието на слайда. Сложих на другия блок, го попитах за размера и изпълнен с цвят. Колко блокове плъзнете клас. много пързалки в нашата плъзгача.

Сега, за да стиловете:

Няма нищо, за да обясни, нищо сложно. За да контролирате бутони се използват за изображения, останалото е лесно.

И сега чифт-Пам-Пам самия скрипт (не забравяйте предварително да се свържете JQuery най-новата версия):

Според него, малко обясня. 1. Той създава кръгови контролния бутон (разположен в долния десен ъгъл) - които ви позволяват да се движите на слайдовете - клас слайдер контроли с вградени тагове обхващат с класове контрол слайд. Активно кръг има клас активни. 2. Той създава слайд бутони в дясно или ляво (появява, когато се движите плъзгача) - следващите класове и предишен съответно. Външен вид на бутоните за управление, за да настроите стил.

Също сценария има няколко възможности: 1. Var SlideSpeed ​​= 700; - номер 700 - е скоростта на слайдшоуто. То се изразява в милисекунди. 2. Var TimeOut = 3000; - номер 3000 - забавяне преди автоматичната промяна на пързалка. То се изразява в милисекунди. Това е всичко, нашата прекрасна плъзгача съдържание готов.

Всички кода в пълен размер:

За тези, които не се нуждаят от бутоните за управление на дясно или на ляво

Просто използвайте следния скрипт:

И следните стилове: