JQuery библиотеката: лизгачи за вашиот вебсајт

Со текот на времето и развојот на технологијата во областа на веб дизајн се менуваат и потребите / барања на корисниците на сајтови со содржина. Ако порано тоа беше главно текстуални содржини со мал број на тематски слики, денес тоа е доминантна компонента на графички. Тоа ви овозможува брзо да добиете најмногу потребни и корисни информации, и да не губите време во читање долги текстови. Во врска со тоа се повеќе популарни и, всушност, неопходен елемент на веб-страница се лизгачи. Тие се блокови со различна содржина во нив - од сликите на линкови. Модерниот начин за да додадете дадена веб објект - со користење на jQuery библиотеката. Лизгачи создадени со оваа алатка, се удобно, лесен за користење, и изгледа многу импресивно. Следна гледаме како да се направи овие елементи на веб-страниците на сопствените. Благодарение на доволно голем број на стандардизирани алатки, тоа е можно да се спроведе JQuery лизгачот тип и разновидна содржина.

Како да додадете лизгачот на веб-страница?

Начини за да додадете слајд блокови на страницата број. Често дури и не мора да пишувате HTML-код и истражувам во сценариото. Постои значителен број на слободни библиотеки, им нуди на корисниците готови шаблони кои ви овозможуваат да додатете JQuery-лизгачи на вашиот сајт. Се што треба да направите - е да ја пренесе во изворниот код на вашата веб страница и да уживате во резултатите. Меѓутоа, во овој случај на можноста за остварување на вашата креативна имагинација е ограничен. Затоа, тоа е корисно да бидат во можност да се создаде дизајн елемент независно. За да го направите ова, треба да знаете како да се имплементира едноставен лизгачот JQuery, и само го искомплицира, секогаш можете да додавање на дополнителни елементи во кодот.

Креирање на лизгачот од себе: во HTML кодот

Прво, од каде да почнам - е да се регистрирате во иднина изгледот на лизгачот.

1. Основана во HTML-датотеката слајдшоу единица, која ќе ги содржи сите од нашите слајдови (слики, итн).
2. Тоа лежи ул листа, секој став од кој ќе ги чува на посебна слајд.

Ние работиме со CSS

Тогаш ние се однесуваат на него карактеристиките на саканиот стил користење на CSS-документ. Неопходно е да се воведе нашата содржина JQuery лизгачот за да работи правилно и има право изглед. Во оваа фаза, ние сме соочени со следниве задачи:

• бидете сигурни дека на единицата на слајдови прикажува само еден, право во моментот слајд (или содржината на сликата), а останатите биле скриени;
• организираме на слајдови еден по друг (од лево на десно);
• направи ул-сад, која продавници слајдови подвижен (лево и десно).

Да го направите ова, во собата на следниве опции во CSS-фајл:

• за клучни зборови: претекување-X - движете се, прелевање-y - скриени:
• на ул: плови - лево.

Исто така можете да го поставите параметри на ширината (ширина), висина (висина), позадина (позадина) и така натаму.

Ние го овој код во JQuery

се направени сите потребни промени на HTML и CSS. Останува случај за кодот JQuery, лизгачи, кои треба да ги имаат следните параметри:

• Слајдови треба да се сменуваат со одреден временски интервал;
• кога ќе лебдат покажувачот на глушецот врз нивното движење треба да престане.

Да го направите ова, ние прогласи две променливи: slidewidth (еднакво на должината на слајд) и slidertime (го определува периодот на слајд шоу). Тајмерот ќе започне кога страната е целосно натоварен сајт. Со овој параметар се врзуваат дејството на покажување на глувчето за да слајд (која го запира слајд шоу).

Бидете сигурни дека за да се препише ул должина сад. Тоа ќе биде еднаков на бројот на слајдови, помножен со должината на секој слајд.

Вметнете ја функцијата одговорен за менување слајдови. Тоа е се, може да се провери ефикасноста на вашиот лизгачот.

заклучок

Во оваа статија ние погледна како да се создаде свој JQuery-лизгачи за да вметнете страница на својата веб страница. Со користење на пример на едноставна лизгачот, може да излезе со своја интерпретација на тоа, што го прави соодветни измени на изворниот код. Ова ќе ја подобри дизајнот и да се направи употреба на вашиот сајт полесно за посетителите.