Átlátszóság a képekre, amikor a css3-el lebeg

Átlátszóság a képekre a CSS3 segítségével lebegő képek esetén

Hogyan készíthetünk képeket a felhasználóval való interakció pillanatában? Vagyis, valahogy érdekes, hogy kiválaszthass egy képet, amikor fölé az egeret.
A probléma technikai megoldásai bőségesek, és a legkisebb részletekben vannak festve. Tehát nem fogok felfedni valami újat, de egyszerűen megoszthatok egy egyszerű CSS kódot, amelyet gyakran különböző változatokban használok fel.

A vonzó áttetsző hatás létrehozásához, vagy a képek lefényképezéséhez a képek elhomályosodása érdekében a CSS3 klip csodálatos opacitás tulajdonságát használjuk.

Két opciót mutatott be az opacitás tulajdonságainak egyszerre. Az első esetben az áttetszőség be van kapcsolva, amikor a kép fölött lebeg, és a második esetben a kép kezdetben kis elmosódottsággal jelenik meg, és már ott, mikor lebeg, rajta az élesség.

Úgy tűnik számomra, hogy Önnek, mivel nem kell egy ilyen hatásra alkalmazni az összes képet egy aggregátumban, ezért elegendő egy külön osztály létrehozása, hogy ne legyen trükkös, például az osztály .opacity. hozzárendelje a kívánt képhez, és már a css-kísérletben ugyanazt a névtípus különböző változatait használja.
Egy átlátszatlanságot korlátozhat az áttetszőség szintjének egy vagy másik irányba történő beállításával, vagy bizonyos értékekkel az illesztés illusztrációját illesztheti a univerzális átmeneti tulajdonság használatával.
A szóban forgó példa első variánsa tekintetében a következő értékeket használtam:

szűrő: az alfa nem véletlenül, a mankó nélkül, az IE8 teljesen megtagadja az áttetszőség kezelését, így most sok ember használja ezt a nedobrazert, felejthetetlen a lotionokkal szemben. Ugyanez igaz a többi böngészőre vonatkozó átmeneti tulajdonság előtagjaival szemben, mégsem egységes a szabványok támogatása, így a megbízhatóságot kifejezetten megadjuk)))

A második változatnál az ellenkezője igaz, a kép alapértelmezés szerint világos átlátszósággal jelenik meg, és amikor lebeg, az élesség helyreáll. Ezt úgy érik el, mint valószínűleg már kitaláltad, a tulajdonságok egyszerű permutációja:

A példában a második opcióhoz hozzárendeltem a .classit. ahogy azt mondják, hogy az első gondolkodott, különösen ebben a vonatkozásban nem szabad elakadni, itt van elég képzelőerő, hogyan fog hívni, így dolgozni fog))).

Ez mindennek tűnik. A legegyszerűbb tulajdonságkészlet, egy kis kezdő sablon ahhoz, hogy egy újabb csodálatos hatást hozzon létre a CSS3 használatával, remélem, hasznos lesz valakinek, és maga a memória is néha megnyugtató.

Őszintén szólva, Andrew.