Si Të Krijoni Një Imazh Pop-up

Përmbajtje:

Si Të Krijoni Një Imazh Pop-up
Si Të Krijoni Një Imazh Pop-up

Video: Si Të Krijoni Një Imazh Pop-up

Video: Si Të Krijoni Një Imazh Pop-up
Video: Si te bejme nje zarf 2024, Mund
Anonim

Dritaret pop-up ose pop-under po bëhen gjithnjë e më të popullarizuara në internet. Ose, më thjesht, fotografi pop-up. Shumë pronarë të faqeve shpesh duhet t'i bëjnë ato për qëllime reklamimi, por jo të gjithë e dinë algoritmin për krijimin e tyre.

Si të krijoni një imazh pop-up
Si të krijoni një imazh pop-up

Është e nevojshme

  • - redaktues HTML;
  • - fletore;
  • - pritja.

Udhëzimet

Hapi 1

Krijoni ose hapni një faqe të re në HTML në HTML ose një redaktues teksti. Ju mund të përdorni programe të njohura si Dreamweaver, Expression Web dhe të tjerë për këtë qëllim. Nëse thjesht po hidhni hapat tuaj të parë në gjuhën e programimit HTML, përdorni një "bllok shënimesh" të rregullt.

Hapi 2

Ngjit kodin e mëposhtëm midis etiketave "kokë" dhe "/ kokë":

.thumbnail {pozicioni: relativ; indeksi z: 0;}

.thumbnail: rri pezull {background-color: transparent; indeksi z: 50;}

hapësira e miniaturës {/ * CSS për imazhin e zgjeruar * / pozicioni: absolut; ngjyra e sfondit: e verdhë e lehtë; mbushje: 5px; majtas: -1000px; kufiri: 1px gri e thyer; dukshmëria: e fshehur; ngjyra: e zezë; dekorimi i tekstit: asnjë;}

.thumbnail span img {/ * CSS për imazhin e zgjeruar * / gjerësia e kufirit: 0; mbushje: 2px;}

.thumbnail: rri pezull {/ * CSS për imazhin e zmadhuar në rri pezull * / dukshmëria: e dukshme; maja: 0; majtas: 65px; / * pozicioni ku imazhi i zmadhuar duhet të kompensohet horizontalisht * /}

Hapi 3

Rregulloni zhvendosjen horizontale të figurës së dritares duke ndryshuar vlerën në rreshtin e fundit të kodit. Alokoni hapësirën midis etiketave "body" dhe "/ body" ku dëshironi të shfaqet imazhi në faqen e internetit. Pastaj kopjoni dhe ngjisni kodin vijues:

Shembull i një titulli teksti

Një shembull i një titulli teksti"

Hapi 4

Zëvendësoni "folder / largepci1.jpg" me skedarin e përdorur për foton që shfaqet. Bëni të njëjtën gjë me bllokun e dytë të kodit. Ndryshoni rreshtin "Shembull i titullit të tekstit" në të në atë që duhet të shkruhet në imazhin pop-up. Gjithashtu ndryshoni vlerat e lartësisë dhe gjerësisë në kod për të rregulluar madhësinë e figurës. Krijoni blloqe shtesë të kodit për të shtuar më shumë skica. Vendosni atribute të tjera, etiketat dhe tekstin në dokumentin HTML sipas nevojës. Ruani skedarin HTML dhe pastaj ngarkojeni atë në serverin tuaj të internetit.

Recommended: