Hogyan változtassuk meg az elem átlátszóságát lebegtetéskor

A modern webhelyeken használt Hover Animation Effects kifinomultabbá vált. Az egyik hatáspélda az Element Move on Hover. Hozzáadhatja az elem mozgatását a lebegtetésen. Adjon hozzá vagy válasszon egy elemet, és lépjen a Tulajdonság panelre. Kattintson a Lebegtetés hivatkozásra, majd jelölje be a Lebegtetés jelölőnégyzetet. Állítsa be a Move X, Y tulajdonság értékeit.

A méretezés a kurzor legtermészetesebb reakciójának tűnhet. Ezért nagyon népszerű lehet. Könnyedén hozzáadhatja webhelyéhez a Scale On Hover funkciót. Ehhez adjon hozzá vagy válasszon ki egy elemet, majd lépjen a Tulajdonság panelre. Kattintson a Lebegtetés hivatkozásra az Animáció bekapcsolva szakaszban, és jelölje be a Lebegtetés jelölőnégyzetet. Görgessen le a Méretezés, Forgatás és Mozgatás tulajdonságokhoz. A tényleges méret 100.

A Kitöltés képekre is módosítható, sőt az egyik Háttérképet egy másikra cserélheti lebegtetés közben, ami nagymértékben szórakoztathatja a látogatókat. Válasszon egy alakzatot, és adjon hozzá egy képet a háttérhez. Lépjen a Tulajdonság panel Animáció bekapcsolva részéhez, és kattintson a Hover gombra. Engedélyezze a Lebegés effektust, és válassza ki a Képet háttértípusként. Válassza ki a Lebegő képet. Teszt.

A lebegő animációt az időtartam beállításával kezelheti. Állítsa be az animáció időtartamát az egérmutatóval adjon hozzá vagy válasszon ki egy elemet, és lépjen a Tulajdonságok panelre. Válassza az Animáció bekapcsolva szakasz Lebegés hivatkozását, és jelölje be a Lebegtetés jelölőnégyzetet. A Slider támogatott értékei 10 és 200 között vannak, és szükség esetén nagyobb számot is beírhat ebbe a mezőbe.

Ha hozzáadja a Lebegő animációt egy háttérrel rendelkező alakzathoz, érdemes lehet a tömör kitöltést valami vonzóra, például színátmenetre módosítani. Ehhez válasszon ki egy alakzatot, és lépjen a Tulajdonságpanel Lebegő hivatkozásra. Kattintson az Animáció bekapcsolva -> Lebegtetés hivatkozásra, és jelölje be a Lebegtetés jelölőnégyzetet. Válassza ki a színátmenet típusát a háttérhez, és állítsa be a színátmenetet.

Az Element Border azért is fontos, hogy javítsa az Elements interakcióját és felhívja a látogatók figyelmét. Módosíthatja a lebegési szegélyt olyan elemeknél, mint az ikon, kép, alakzat, csoport, rács stb. A Tulajdonságok panel Lebegés szakaszában jelölje be a Lebegés jelölőnégyzetet. Módosítsa a szegélyt, hogy az elem lebegtetése közben megjelenjen.

Az Elem színének lebegtetésre állítása segít a látogatók figyelmét egy elemre összpontosítani, és benyomást és fogalmat kölcsönöz a jelentésének kívánt elképzeléséről. Megváltoztathatja az elem színét az egérmutatóval. Ehhez válasszon ki egy elemet, és a Tulajdonságok panelen lépjen az Animáció bekapcsolva szakaszba, kattintson a Lebegtetés hivatkozásra, majd a Lebegtetés jelölőnégyzetre. Módosítsa a színt, hogy az egérmutatót rávegye.

A Rotation on Hover a következő fontos és összetett hatás. Egy elem elforgatásához adjon hozzá vagy válasszon ki egy elemet, és lépjen a Tulajdonságok panelre. Nyissa meg és kattintson a Lebegés hivatkozásra az Animáció bekapcsolva részben, majd jelölje be a Lebegtetés jelölőnégyzetet. A csúszkával állítsa be az elforgatási szöget, vagy írja be az értéket a beviteli mezőbe. Az elforgatási szög támogatott értékei 0 és 359 között vannak.

Módosíthatja az Árnyék tulajdonságot a Szövegekhez és más elemekhez a Hoveren. A Shadow on Hover beállításához adjon hozzá vagy válasszon ki egy elemet. Ezután kattintson a Property Panel Hover hivatkozására, jelölje be a Lebegtetés jelölőnégyzetet, módosítsa a Lebegtetésre alkalmazandó árnyékot. Kezdheti az egyik árnyék-előbeállítással, és szükség esetén testreszabhatja.

A képek és alakzatok, csoportok és rácscellák esetében módosíthatja a sugarat a lebegtetéskor. Az elemek vonzóvá válnak ezzel a tulajdonsággal, cselekvésre késztetnek (Vásárlás most, További információ gombok stb.), és egyedivé teszik a dizájnt. A Tulajdonság panel Lebegés részében engedélyezze a Lebegés módot. Húzza el a Sugár csúszkát az On Hover értékének beállításához.