Pop-up- eller pop-under-vinduer blir mer og mer populære på Internett. Eller, enklere, popup-bilder. Mange nettstedseiere må ofte lage dem for reklameformål, men ikke alle kjenner algoritmen for deres opprettelse.
Det er nødvendig
- - HTML editor;
- - notisbok;
- - hosting.
Bruksanvisning
Trinn 1
Opprett eller åpne en ny webside i HTML eller en tekstredigerer. Du kan bruke populære programmer som Dreamweaver, Expression Web og andre til dette formålet. Hvis du bare tar dine første skritt i HTML-programmeringsspråket, bruker du et vanlig "notisblokk".
Steg 2
Lim inn følgende kode mellom kodene "head" og "/ head":
.thumbnail {posisjon: relativ; z-indeks: 0;}
.thumbnail: hover {bakgrunnsfarge: gjennomsiktig; z-indeks: 50;}
. miniatyrbilde {/ * CSS for forstørret bilde * / posisjon: absolutt; bakgrunnsfarge: lys gul; polstring: 5px; venstre: -1000px; kant: 1px stiplet grå; synlighet: skjult; farge svart; tekstdekorasjon: ingen;}
.thumbnail span img {/ * CSS for forstørret bilde * / border-width: 0; polstring: 2px;}
.miniatyrbilde: hover span {/ * CSS for forstørret bilde ved sveve * / synlighet: synlig; topp: 0; venstre: 65px; / * posisjon der forstørret bilde skal forskyves horisontalt * /}
Trinn 3
Juster den horisontale forskyvningen av popup-bildet ved å endre verdien på den siste linjen med kode. Tildel mellomrom mellom "body" og "/ body" -kodene der du vil at bildet skal vises på websiden. Kopier og lim deretter inn følgende kode:
Eksempel på en teksttittel
Et eksempel på en teksttittel"
Trinn 4
Erstatt "mappe / largepci1.jpg" med filen som brukes til popup-bildet. Gjør det samme med den andre koden. Endre linjen "Eksempel på teksttittel" i den til det som skal skrives i popup-bildet. Endre også høyde- og breddeverdiene i koden for å justere størrelsen på popup-bildet. Lag flere kodeblokker for å legge til flere skisser. Skriv inn andre attributter, koder og tekst i HTML-dokumentet etter behov. Lagre HTML-filen og last den opp til webserveren din.
