Creați o galerie cu pluginul jQuery fancybox

Să subliniem planul de acțiune pentru crearea unei galerii:
1. Descărcați arhiva plug-in.
2. Creați o structură simplă a galeriilor.
3. Conectați scripturile și stilurile pluginului la pagina noastră cu galeria.






4. Faceți un script mic, care va lega fotografiile noastre într-o galerie FancyBox.

1. Descărcați arhiva plug-in

Apoi cred că nu va fi nici o problemă, mergem la link-ul:

Creați o galerie cu pluginul jQuery fancybox

Faceți clic pe butonul afișat în imagine și arhiva cu pluginul va fi descărcată de dvs. pe PC.

2. Creați o structură simplă a galeriilor

Structura noastră va consta din imagini împachetate în legături:







Aici este HTML complet al galeriei de 4 poze

3. Conectați scripturile și stilurile de pluginuri la pagina noastră cu galeria

Aici am decis să conectez un minim de stiluri și scripturi necesare,
Desigur, conectăm biblioteca jquery, stilurile și scripturile pluginului fancybox și stilurile și scripturile pentru demo (în cazul tău, fișierul de stil și scriptul site-ului tău).

4. Faceți un script mic, care va lega imaginile noastre într-o singură galerie FancyBox

Conținutul fișierului script.js. în care specificăm clasa selector la care conectăm galeria jQuery fancybox:

În fișierul de stil pentru galeria noastră demo vor fi mai multe linii:

De asemenea, aici sunt linkuri către site-ul plug-in-ului și la site-ul de documentare

Bună ziua. Încerc să creez o galerie de fotografii de bijuterii, în care fiecare lucru avea mai multe fotografii, dar pe pagină ar fi vizibil doar unul, iar când ai făcut clic pe el, ai putea vedea alte fotografii ale aceluiași lucru. Pe site-ul dezvoltatorului, acest lucru se numește imagini ascunse. Am incercat sa aplic codurile pe care dezvoltatorul le-a prescris, dar nu functioneaza. Clic pe fotografie, lucrări de derulare și fotografia reflectă doar una.
Și dezvoltatorul oferă, de asemenea, un script care arată un buton Like and Tweet pe imagine. Aici se reflectă tweet-ul și Facebook nu este :-(
Ați întâlnit unul similar? Pot să scriu codurile.
Vă mulțumim în avans!







Articole similare

Trimiteți-le prietenilor: