Ponnahdusikkunat tai ponnahdusikkunat ovat yhä suositumpia Internetissä. Tai yksinkertaisesti, ponnahdusikkunoita. Monien sivustojen omistajien on usein tehtävä ne mainostarkoituksiin, mutta kaikki eivät tiedä niiden luomisen algoritmia.
Se on välttämätöntä
- - HTML-editori;
- - muistikirja;
- - isännöinti.
Ohjeet
Vaihe 1
Luo tai avaa uusi verkkosivu HTML-muodossa tai tekstieditorissa. Voit käyttää tähän tarkoitukseen suosittuja ohjelmia, kuten Dreamweaver, Expression Web ja muita. Jos olet vasta tekemässä ensimmäisiä vaiheitasi HTML-ohjelmointikielellä, käytä tavallista "muistilehteä".
Vaihe 2
Liitä seuraava koodi tagien "head" ja "/ head" väliin:
.pikkukuva {sijainti: suhteellinen; z-indeksi: 0;}
.pikkukuva: hiiren osoitin {taustaväri: läpinäkyvä; z-indeksi: 50;}
.pikkukuva {/ * CSS suurennetulle kuvalle * / sijainti: absoluuttinen; taustaväri: vaaleankeltainen; pehmuste: 5px; vasen: -1000 kuvapistettä; reunus: 1px katkoviivainen harmaa; näkyvyys: piilotettu; väri musta; tekstikoristelu: ei mitään;}
.thumbnail span img {/ * CSS suurennetulle kuvalle * / reunan leveys: 0; pehmuste: 2px;}
.thumbnail: hover span {/ * CSS suurennetun kuvan osoittamiseksi hiirellä * / visibility: visible; yläosa: 0; vasen: 65 kuvapistettä; / * sijainti, jossa suurennetun kuvan tulisi siirtyä vaakasuoraan * /}
Vaihe 3
Säädä ponnahdusikkunan vaakasuuntaista siirtymää muuttamalla koodin viimeisen rivin arvoa. Varaa "body" - ja "/ body" -tagien väliin tilaa, johon haluat kuvan näkyvän verkkosivulla. Kopioi ja liitä seuraava koodi:
Esimerkki tekstin otsikosta
Esimerkki tekstin otsikosta"
Vaihe 4
Korvaa "folder / largepci1.jpg" ponnahdusikkunassa käytetyllä tiedostolla. Tee sama toisen koodilohkon kanssa. Muuta sen rivi "Esimerkki tekstin otsikosta" ponnahdusikkunan kirjoitettavaksi. Muuta myös koodin korkeus- ja leveysarvoja säätääksesi ponnahdusikkunan kokoa. Luo lisää koodilohkoja lisätäksesi luonnoksia. Syötä muut määritteet, tunnisteet ja teksti HTML-dokumenttiin tarpeen mukaan. Tallenna HTML-tiedosto ja lataa se sitten Web-palvelimeesi.
