JQuery գրադարանը: կարգավորիչներ մուտք գործելու համար Ձեր կայքը

Հետ ընդունման ժամանակի եւ տեխնոլոգիաների զարգացման ոլորտում վեբ դիզայնի փոխվում են, եւ կարիքները / պահանջները օգտագործողների դեպի բովանդակության կայքեր. Եթե նախկինում դա հիմնականում տեքստային բովանդակության մի փոքր շարք թեմատիկ պատկերներ, այսօր դա գերիշխող բաղադրիչն է արվեստ: Այն թույլ է տալիս Ձեզ արագ ստանալ առավել անհրաժեշտ ու օգտակար տեղեկատվություն, եւ չեն վատնել ժամանակ կարդում երկար տեքստեր: Այս կապակցությամբ ավելի ու ավելի տարածված է եւ, ըստ էության, անհրաժեշտ տարր է ինտերնետային էջի են կարգավորիչներ մուտք գործելու: Նրանք են արգելափակում տարբեր բովանդակություն նրանց - ից պատկերների է հղումներ. Ժամանակակից միջոց է ավելացնել տրված վեբ օբյեկտ, օգտագործելով JQuery գրադարան: Կարգավորիչներ մուտք գործելու, ստեղծված այս գործիքը, ստանալ հարմարավետ, հեշտ է օգտագործել, եւ շատ տպավորիչ. Հաջորդ նայում ենք, թե ինչպես պետք է անել, այդ տարրերը վեբ էջերի վրա իրենց սեփական. Շնորհիվ բավականին մեծ թվով ստանդարտացված գործիքների, դա հնարավոր է իրականացնել JQuery slider տիպի եւ բազմազան բովանդակություն.

Ինչպես ավելացնել slider ին ինտերնետային էջում:

Եղանակներ ավելացնել Slide-նյութից է էջի համարին: Հաճախ չեն էլ պետք է գրել HTML կոդ եւ խորանալու են սցենարի. Կա մի զգալի թվով անվճար գրադարանների, առաջարկելով օգտատերերին պատրաստի կաղապարներ, որ թույլ եք ավելացնել jQuery-կարգավորիչներ մուտք գործելու, Ձեր կայքում. Բոլոր դուք պետք է անեք - է պատճենել այն կոդով Ձեր վեբ էջերի եւ վայելել արդյունքները. Սակայն, այս դեպքում հնարավորությունը իրականացման ձեր ստեղծագործական երեւակայության սահմանափակ է. Հետեւաբար, դա օգտակար, որպեսզի կարողանանք ստեղծել դիզայն տարր ինքնուրույն: Որպեսզի դա անել, դուք պետք է իմանալ, թե ինչպես պետք է իրականացնել JQuery պարզ slider, եւ միայն բարդացնում այն, դուք կարող եք միշտ ավելացնելով լրացուցիչ տարրերը օրենսգրքի:

Ստեղծել մի slider է ինքներդ: է HTML կոդը

Նախ, որտեղ սկսել է գրանցել ապագա դասավորությունը է slider.

1. Ստեղծվել է HTML-ֆայլի Slideshow միավորի, որը պարունակում է բոլոր մեր սահարաններից (պատկերների եւ այլն):
2. Այն պառկել ul ցուցակը, որոնցից յուրաքանչյուրը պարբերություն, որը պետք է պահել առանձին սահեցրեք.

Մենք աշխատում ենք CSS

Հետո մենք կիրառել ենք դրան բնորոշ են ցանկալի ոճով, օգտագործելով CSS-փաստաթուղթ: Անհրաժեշտ է պարտադրել մեր բովանդակության JQuery slider է աշխատի եւ ուներ ճիշտ տեսքը. Այս փուլում, մենք կանգնած է հետեւյալ խնդիրները `

• համոզվեք, որ այն Սլայդ միավորի ցուցադրում է միայն մեկ, հենց այդ պահին slide (կամ նկար բովանդակությունը), իսկ մյուս մասը թաքնված.
• Կազմակերպել սլայդներ մեկը մյուսի (ձախից աջ).
• անել ուլ-կոնտեյներով, որը պահում slides շարժական (ձախ եւ աջ):

Որպեսզի դա անել, սահմանվել է հետեւյալ ընտրանքները CSS ֆայլ:

• համար Սլայդ: տոգորվել-x - ոլորել, հեղեղել-y - թաքնված:
• համար ուլ: բոց ձախ.

Նաեւ կարող եք սահմանել պարամետրերի լայնությամբ (լայնությունը), բարձրությունը (բարձրություն), ֆոնային (ֆոնային) եւ այլն:

Մենք դրել այս կոդը JQuery

HTML եւ CSS բոլոր անհրաժեշտ փոփոխություններ են կատարվել. Այն շարունակում է մնալ այն դեպքն է jQuery կոդը, կարգավորիչներ մուտք գործելու, որը պետք է ունենա հետեւյալ պարամետրերը:

• Սլայդներ պետք է հաջողության հասնել միմյանց հետ որոշակի ժամանակ ընդմիջումից,
• երբ դուք անցեք մկնիկը ցուցիչ շուրջ իրենց շարժմանը պետք է դադարեցնի:

Որպեսզի դա անել, մենք հայտարարում ենք երկու փոփոխականներ `slidewidth (հավասար երկարությամբ սահեցրեք) եւ slidertime (որոշում է ընկած ժամանակահատվածի slide շոու): Ժմչփ կսկսի, երբ էջը գտնվում լիովին բեռնված կայք: Ըստ այս պարամետրի մենք կապել ակցիա մկնիկի սլաքի մատնացույց է slide (որը դադարում է slide show):

Վստահ լինել, նախատեսել ul կոնտեյներային երկարությունը: Դա կլինի հավասար թվով սլայդներ, բազմապատկած երկարությամբ յուրաքանչյուր slide.

Տեղադրեք գործառույթը պատասխանատու փոխելու համար սլայդներ. Որ այդ ամենը, Դուք կարող եք ստուգել կատարումը ձեր slider.

եզրափակում

Այս հոդվածում մենք նայում, թե ինչպես պետք է ստեղծել սեփական jQuery-կարգավորիչներ մուտք գործելու Մտցրեք էջը իր ինտերնետային կայքում: Օգտագործելով օրինակը պարզ slider, դուք կարող եք գալ իրենց սեփական մեկնաբանությամբ այն, կատարելով համապատասխան փոփոխություններ կատարելու կոդով: Սա կբարելավի դիզայնի եւ օգտվել ձեր կայքում ավելի հարմար է այցելուների համար: