O imagine de tip pop-up atunci când treceți peste un link

O imagine de tip pop-up atunci când treceți peste un link

După cum se știe, pentru a pune în aplicare imagini de tip pop-up poate fi folosind jQuery, CSS si HTML. În articolul de azi, voi posta codul finit pentru acest efect, precum și a da câteva exemple ilustrative. Fiecare script este destul de simplu, este creat prin intermediul CSS + HTML. Nu te ostenească mai mult și vă va oferi soluții complete!

Pop-up imagine atunci când treci

Când treceți peste textul afișat ascuns conținut grafic

Dă-i drumul. Mutați cursorul pe mine!

Când treceți peste textul afișat ascuns conținut grafic mai îndrăzneț. Mutați cursorul pe mine!

O imagine de tip pop-up atunci când treceți peste un link

Permiteți-mi să explic pe scurt principalele puncte. Pentru a afișa o imagine pop-up este necesar să se facă referire la tag-ul cu atributul src, iar după semnul egal între ghilimele pentru a seta calea către imaginea, de pre-încărcați-l în directorul rădăcină al site-ului.

etichetă <а> parametru obligatoriu href responsabil pentru crearea și afișarea de link-uri (în exemplul meu este un text).

În cazul în care obiectele s-au mutat site-ul, puteți specifica lățimea și înălțimea imaginii, folosind lățimea și proprietatea bre. Parametrii sunt stabilite în pixeli.

Atributul alt permite motoarele de căutare să recunoască cu mai multă precizie ceea ce este descris în imagine.

Pentru o mai mare claritate, am identificat o parte a codului, probabil că doriți să modificați.

Pop-up text atunci când treceți peste un link

Punctul important! Fiecare dintre aceste script-uri nu afectează valabilitatea site-ului.

Nu mai puțin convenabil să ia în considerare punerea în aplicare a sarcinii prin adăugarea unui script special într-un fișier de stiluri de șablon, care este de obicei numit style.css.

CSS imagine pop-up

sarcină
Hei! Cum te simți?

Acest exemplu de realizare este considerată mai puțin acceptabilă, deoarece permite ca un pop-up cuvinte și caractere folosiți doar litere. Prescrierea semne chirilice pe site-ul par fără sens, care afectează negativ valabilitatea site-ului. Acesta este motivul pentru care, în exemplul de link-uri am folosit cuvinte în limba engleză.

Codul care urmează să fie inserat la sfârșitul acestui fișier sau înainte de eticheta de deschidere .

Vă mulțumesc și veți vedea în curând pe paginile Stimylrosta.

Nu fi leneș, împărtășiți!

articole similare