Les finestres emergents o emergents són cada vegada més populars a Internet. O, més simplement, imatges emergents. Molts propietaris de llocs solen haver de fer-los amb finalitats publicitàries, però no tothom coneix l’algoritme per a la seva creació.
És necessari
- - Editor HTML;
- - quadern;
- - allotjament.
Instruccions
Pas 1
Creeu o obriu una pàgina web nova en HTML o en un editor de text. Podeu utilitzar programes populars com Dreamweaver, Expression Web i altres amb aquest propòsit. Si només esteu fent els primers passos en el llenguatge de programació HTML, utilitzeu un "bloc de notes" normal.
Pas 2
Enganxeu el codi següent entre les etiquetes "head" i "/ head":
.miniatura {posició: relativa; índex z: 0;}
.miniatura: passeu el cursor {background-color: transparent; índex z: 50;}
extensió de miniatures {/ * CSS per a una imatge ampliada * / posició: absoluta; color de fons: groc clar; encoixinat: 5 px; esquerra: -1000px; vora: 1 px gris ratllat; visibilitat: oculta; color: negre; decoració de text: cap;}
.thumbnail span img {/ * CSS per a imatge ampliada * / border-width: 0; farciment: 2 px;}
.miniatura: extensió del cursor {/ * CSS per a la imatge ampliada al cursor * / visibilitat: visible; superior: 0; esquerra: 65 px; / * posició on la imatge ampliada s'hauria de desplaçar horitzontalment * /}
Pas 3
Ajusteu el desplaçament horitzontal de la imatge emergent canviant el valor de l'última línia de codi. Assigneu espai entre les etiquetes "body" i "/ body" on vulgueu que aparegui la imatge a la pàgina web. A continuació, copieu i enganxeu el codi següent:
Exemple de títol de text
Un exemple de títol de text"
Pas 4
Substituïu "carpeta / largepci1.jpg" pel fitxer utilitzat per a la foto emergent. Feu el mateix amb el segon bloc de codi. Canvieu la línia "Exemple de títol del text" a la que s'hauria d'escriure a la imatge emergent. També canvieu els valors d’alçada i amplada del codi per ajustar la mida de la imatge emergent. Creeu blocs de codi addicionals per afegir més esbossos. Introduïu altres atributs, etiquetes i text al document HTML segons calgui. Deseu el fitxer HTML i pengeu-lo al vostre servidor web.
