Galerie jquery lightbox;

un aspect personalizat

Cum se configurează plugin-ul utilizând parametrii de inițializare, acum cred că este clar. Să ating pe setările un pic mai complicate.

image schimbare

Deci, calea spre un nou set imagini folosind imageLoading, imageBtnClose, imageBtnPrev și imageBtnNext. Dar dacă aceleași imagini sunt diferite ca dimensiune? Nu este o problemă. Editare jquery.lightbox-0.5.css:

În ceea ce privește butonul „Next“, „precedent“, în cele mai multe cazuri, nu aveți nevoie pentru a schimba stiluri. Având în vedere că butonul în sine este mult mai mare și imaginea sa de fundal ocupă aproape jumătate din fotografie. Acest lucru este destul de convenabil - nu este nevoie să faceți clic exact pe etichetă. Klatsnut suficient, de exemplu, „undeva la stânga“ și a obține tranziția la Fautua anterioară. Dacă aveți nevoie pentru a schimba zona klikabilnuyu - edita regulile pentru # lightbox;-NAV-btnPrev și # lightbox;-nav-btnNext.

Legende sub poze

Dacă se dorește, puteți seta semnăturile individuale ale fiecărei imagini mărite. În acest sens, de asemenea, plugin-ul a crescut la ocazie. Semnăturile sunt date un mod foarte simplu și logic - titlul atribuie eticheta o:

Context pentru mai multe fotografii

Parametrul OverlayBgColor setează culoarea de fundal pentru pagina de umplere. Și dacă doriți să modificați fundalul unei fotografii mari va avea din nou o regulă de stil.

Eliminați elementele nedorite

Și dacă am nevoie doar de o fotografie mai mare fără nici o priză cu semnăturile? Nici o problemă! Mergem la stiluri și adăugați display: none:

„Imaginea X din N» un pic mai dificil de a elimina doar inscripția. Acesta are, de obicei un selector # lightbox;-image-detalii-currentNumber. Pur și simplu display: none; nu există o plimbare, pentru că script-l rearanja pentru a afișa: bloc. E în regulă! Doar întrerupe cu importante !:

Demo exemplu - aceeași galerie, dar cu mai mult de reglaj fin.

Surpriza IE6 (în modul quirks)

Ca întotdeauna zbura în unguent de la un măgar vechi. În IE6 în modul de compatibilitate inversă, reperat un bug - panoul cu textul ușor mai îngust decât modelul panoului.

Din păcate, stiluri, repara nu va funcționa - pentru lățimea corespunde scenariului. Prin urmare, dacă doriți să scape de bug-ul (și nu întotdeauna nevoie - în multe site-uri ale panoului cu textul în astfel de galerii doar masca), atunci trebuie să editați script-uri. Una dintre opțiunile găsite în linia de text plug-in:

... în fața ei și a introdus forțat pentru a crește lățimea unui măgar. Ceva de genul asta:

Este de la sine, fără astfel de interferențe nu va permite utilizarea versiunii pachet a pluginului (sau forță reambalat).

  • funcționează în mod adecvat în toate browserele populare;
  • Ea nu are nevoie de crearea unor construcții ilogice HTML, clase sau atribute suplimentare;
  • Ușor de configurat și obligatorii.

materiale:

articole similare