A pop-up képet, ha az egérrel egy linket

A pop-up képet, ha az egérrel egy linket

Mint ismert, hogy végre felugró képeket lehet jQuery, CSS és HTML. A mai cikk, írok a kész kódot ezt a hatást, valamint hogy néhány szemléltető példákat. Minden szkript meglehetősen egyszerű, jön létre útján CSS + HTML. Nem bosszantjátok több és kapsz komplett megoldások!

Pop-up kép, ha lebeg

Amikor az egérrel a szöveg jelenik rejtett grafikus tartalom

Menj előre. Vigye a kurzort rám!

Amikor az egérrel a szöveg jelenik rejtett merészebb grafikus tartalom. Vigye a kurzort rám!

A pop-up képet, ha az egérrel egy linket

Hadd röviden bemutatják a főbb pontokat. Ahhoz, hogy megjelenjen a felugró kép utalni kell a tag A src attribútum, és egyenlőségjel után idézőjelben beállítani az elérési utat a képet, előre töltse fel gyökérmappáját az oldalon.

címke <а> kötelező paraméter href kialakulásáért felelős és megjelenítését kötelék (én például egy szöveges).

Ha terméket költözött az oldal, akkor adja meg a kép szélességét és magasságát, a width és hé tulajdon. A paraméterek beállítása pixelben.

alt attribútum lehetővé keresők, hogy pontosabban ismerjék ábrázolja a kép.

A jobb áttekinthetőség érdekében, azonosítottam a részét a kódot, akkor valószínűleg érdemes megváltoztatnia.

Pop-up szöveget, ha az egérrel egy linket

A lényeg! Mindegyik szkriptek nem károsítja az érvényességét a helyszínen.

Nem kevésbé kényelmes, hogy fontolja meg a végrehajtása a feladat hozzáadásával speciális szkript egy fájlt a sablonstílusok, ami általában úgynevezett style.css.

CSS pop-up kép

terhelés
Hey! Hogy vagy?

Ez a megvalósítás kevésbé tartják elfogadhatónak, mivel lehetővé teszi a pop-up szavakat és karaktereket, csak betűket. Felírása cirill jelek az oldalon megjelenik halandzsa, amely hátrányosan érinti a helyszínen. Ezért a példában a linkek I használt angol szavak.

A kódot kell beilleszteni a végén a fájlt, vagy mielőtt a nyitó címke .

Köszönöm, és találkozunk hamarosan Stimylrosta oldalakon.

Ne légy lusta, ossza meg!

Kapcsolódó cikkek