Spoiler simplu și frumos pentru jquery

Astăzi vreau să vă spun despre un simplu și, în același timp, destul de spectaculos de text de moda arata pe site. Cu siguranță ai întâlnit de multe ori cu spoilere pe diverse resurse, în principal, în organizarea verticală meniu vertical sau ascunde / afișa informații suplimentare. Spoilere ajuta nu supraîncărca sat, pentru a face textul mai ușor de citit și de a adăuga interactivitate.







Spoiler va face pe jQuery. Această opțiune presupune compatibilitatea nelimitată a cuiburilor și a browserului încrucișat.

Extras din Wiki:

Nu este un efect destul de rău? În plus, vă permite să ascundeți nu numai text, ci imagini, tabele și, în general, aproape orice marcaj html.

După cum puteți vedea, ascunderea sub spoiler nu este un text simplu, ci cu marcaj html. Ei bine, e timpul să vă spun cum se face toată frumusețea asta.

Pentru a începe, aveți nevoie de etichetă conectați biblioteca jQuery și adăugați un script cu codul de procesare al funcției noastre. Iată cum arată:

Acolo vom adăuga descrierea stilului CSS (sau în foaia de stil utilizată). Aici domeniul de creativitate nu este limitat. Iată CSS-ul folosit pentru exemplul de mai sus:

De fapt, rămâne în corpul paginii pentru a înregistra două

blocați, după cum se arată mai jos, și vă puteți bucura de rezultat:

În concluzie, vreau să dau un exemplu de utilizare a cuiburilor unui spoiler într-un altul:







Textul primului nivel de cuibărit

Și unde pot obține acest jquery.min.js?

S-a găsit un birou. site-ul jQuery, fișier descărcat.

Script-ul nu funcționează, nu vrea să împingă în jos conținutul paginii, direct pe sarcină creează un câmp gol în cazul în care se va deschide când faceți clic pe titlu.

Imagine într-un script umplute 790h1018 - câmpuri goale pentru a dezvălui prea mult de un spoiler.

În general, trebuie să scut 8 dintre aceste imagini în spoiler.

Această instrucțiune, trebuie să fiți citit direct pe site.

Nu pot să înțeleg, fac totul așa cum este scris, dar nu se întâmplă nimic. Ajutați-vă să înțelegeți.

Dacă scriptul nu funcționează, atunci în stilurile blocului este scrisă poziția: relativă. Înlocuiți cu poziția: absolută; .

Vreau să fac o listă de divuri, în fiecare astfel pune spoiler, problema este ca sariturile meniurile spoiler sub div care vine după ea. Ce se poate face? z-index nu ajută

În loc de un spoiler, fac o redirecționare către pagina în care mă aflu

cum de nu înțeleg

Bine ai venit! Spuneți-mi cum pot schimba culoarea cadrului în cod? (doar ma stăpâni html și nu mă pot orienta, unde gama sa ascuns). În codul css color găsite, înlocuit, dar pe site-ul tot același cadru portocaliu. (aparent în css culoarea textului, nu a cadrului). Ehh.

Ne pare rău pentru probleme) Sa dovedit că în cap două coduri antipolar au fost păstrate. Vechi eliminate și culoarea cadrului sa schimbat)))

Multe mulțumiri pentru articol! O sută de ani caută un spoiler - text, nu un buton) Și numai atunci muncitorul a fost prins)))

Ce zici de indexarea textului ascuns în acest spoiler. Motoarele de căutare indexează textul ascuns în spoiler?

Bună ziua. Spoilerul este un frumos și, mai presus de toate, un muncitor. Există un singur lucru: atunci când faceți clic pe link-ul spoilerului te duce la o pagină în cazul în care acest spoiler (pagina reîmprospătează) și numai după aceea totul funcționează (spoiler se deschide). Care ar putea fi problema?

Cele mai citite







Articole similare

Trimiteți-le prietenilor: