JQuery liburutegiaren: Zure web graduatzaileak

Denboraren poderioz eta teknologia garatzeko web diseinu arloan aldatzen ari dira eta beharrak / eskakizun erabiltzaileen edukien guneak izanda. Lehenago bada gehienbat zen testuaren edukiari gaikako irudi kopuru txiki batekin, gaur grafikoa osagai nagusi da. Informazio gehien beharrezkoa eta erabilgarria azkar lortuko duzu, eta ez denbora alferrik testuak luzeak irakurtzeko aukera ematen du. hau gero eta herri eta, hain zuzen ere lotuta, beharrezkoa web orri baten elementu graduatzaileak dira. irudiak loturak - Eduki desberdinak haiekin batera blokeak dira. JQuery liburutegiaren erabiliz - modu moderno bat eman web-objektu gehitzeko. tresna honekin sortu Irristailuak, lortu eroso, erraz erabiltzen da, eta oso ikusgarria itxura. Hurrengo begiratu euren kabuz web orrien elementu horiek nola egin dugu. Tresna estandarizatu kopuru nahiko handi bati esker, posible da JQuery graduatzaile-mota eta edukiak anitza ezartzeko.

Nola graduatzaile bat gehitu web orri batean?

Modu bat diapositiba-blokeak orrira zenbakia. Askotan ere ez dute HTML-kodea idatzi eta gidoia murgiltzera. Ez dago liburutegi doan mordoxka bat, erabiltzaile JQuery-graduatzaileak gehitu duzu zure gunean utzi dela prest egindako txantiloiak eskainiz. Guztiak egin behar duzu - da, kopiatzeko iturria zure web-kodea sartu eta emaitzak gozatzeko. Hala ere, kasu honetan, zure sormen irudimena gauzatzeko posibilitatea mugatua da. Beraz, erabilgarria diseinu elementu independentean sortzeko gai izango da. Horretarako, the JQuery sinplea graduatzailea ezartzeko jakin behar duzu, eta soilik zaildu egiten du, beti duzu Kodea elementu gehigarriak jartzeko daiteke.

Sortu graduatzailea bakarrik: HTML kodean

Lehenik eta behin, non hasi - da etorkizuneko graduatzailea diseinua erregistratzeko.

1. HTML fitxategi Slideshow unitatea, eta horrek gure diapositibak guztia edukiko (irudiak, eta abar) sortua.
2. ul zerrenda arautuko da, eta horrek paragrafo bakoitza bereizi diapositiba bat gordeko du.

Dugu CSS lanean ari

Ondoren aplikatuko da dugun CSS-dokumentu erabiliz nahi duzun estiloa ezaugarriak. gure eduki JQuery graduatzailea inposatzeko bezala lan egiteko beharrezkoa da, eta eskuineko itxura izan. Etapa honetan, zeregin hauek aurrean gaude:

• Ziur Slideshow unitatea on hori bat bakarrik erakusten du, ezta une diapositiba (edo irudi eduki), eta gainerako ezkutatuta ziren egin;
• antolatu diapositibak bat bestea (ezkerretik eskuinera) ondoren;
• ez ul-edukiontzi, zein diapositibak gordetzen mugikorrak (ezker eta eskuin).

Horretarako, honako the CSS fitxategi aukerak ezarri:

• Aurkezpena eta: gainezkatzea-x - korrituko, gainezkatzea-y - ezkutatuta:
• ul for: karroza - utzi.

Era zabalera parametroak (zabalera), altuera (altuera), hondo (atzealde) eta abar ezar dezakezu.

kode hau jarri dugu JQuery in

HTML eta CSS beharrezko aldaketa guztiak egin dira. the JQuery kodea, graduatzaileak, eta bertan honako parametroak eduki behar duten kasuan izaten jarraitzen du:

• Diapositibak elkarri arrakasta behar denbora jakin tarte batekin;
• denean pasatzean saguaren erakuslea baino gehiago bere mugimendua utziko luke.

slidewidth eta slidertime (diapositiba luzera berdina) (zehazten diapositiba epea): Horretarako, bi aldagai aldarrikatzen dugu. tenporizadorea hasiko orriaren da guztiz kargatu gune. parametro hau By saguaren erakuslea seinalatuz ekintza lotzeko dugun diapositiba bat (horrek diapositiba geltokiak).

Ziurtatu ul edukiontzi luzera prescribe. diapositibak kopurua, biderkatu diapositiba bakoitzaren luzerak berdinak izango da.

Sartu funtzioaren diapositibak aldatzen ardura. Hori guztia, zure graduatzailea errendimendua egiaztatu dezakezu.

ondorio

Artikulu honetan begiratu haien JQuery-graduatzaileak nola sortu bere web orri batean txertatzeko dugu. slider sinple baten adibidea erabiliz, zatoz ditzakete beren eguneroko interpretazio propioa, iturburu-kodea aldaketak egokiak eginez. Hau diseinua hobetu egingo du eta zure gune erabilera gehiago bisitarientzat eroso egin.