Ховер эффект гэж юу вэ?

2024 Зохиолч: Lynn Donovan | [email protected]. Хамгийн сүүлд өөрчлөгдсөн: 2023-12-15 23:50

Hover Effect : Поп болон дэвсгэрийн хөдөлгөөнт дүрс. Хулганы эффект бүтээгдэхүүний хувьд. Зураг дээш доош гарч ирэх ба дараа нь дэвсгэр нь гулсаж, хөдөлгөөнтэй болно.

Мөн зураг эргэлдэж байх үед текстийг хэрхэн харуулахыг та мэдэх үү?

Хөдөлгөөнт текстийг зөвхөн CSS3 ашиглан хэрхэн хулган дээр байрлуулсан зураг дээр харуулах вэ

1. HTML үүсгэх¶ ашиглан зургаа нэмнэ үү

   шошго ба текст. Эхлээд та зургаа ашиглан зургаа нэмэх хэрэгтэй

   шошго.

2. CSS үүсгэх¶ Set:hover сонгогч. Hover-ийн нөлөөг элементийг сонгож, загварчилдаг:hover псевдо анги ашиглан тохируулна.

Хүн бас асууж магадгүй, чи hover-г хэрхэн ашигладаг вэ? :hover сонгогчийг хулганаар хулганаар элементүүдийг сонгоход ашигладаг.

1. Зөвлөмж::hover сонгогчийг зөвхөн холбоос дээр биш бүх элемент дээр ашиглаж болно.
2. Зөвлөмж: Зочлоогүй хуудсуудын холбоосыг загварчлахын тулд:link сонгогч, зочилсон хуудасны холбоосыг загварчлахын тулд:visited сонгогч, идэвхтэй холбоосыг загварчлахын тулд:active сонгогчийг ашиглана уу.

Эндээс та CSS дээр зургийг хэрхэн хулганаа аваачих вэ?

Хариулт: CSS background-image шинж чанарыг ашиглана уу

1. CSS дээр Hover дээр зургийг өөрчлөх
2. .карт {
3. өргөн: 130px;
4. өндөр: 195px;
5. дэвсгэр: url("images/card-back.jpg") давтагдахгүй;
6. дэлгэц: inline-block;
7. }

Би догдлолоос хэрхэн ангижрах вэ?

Ховер эффектийг идэвхгүй болгохын тулд надад хоёр зөвлөмж байна:

1. Хэрэв таны хулганын эффект JavaScript-ээр өдөөгдвөл $-г ашиглана уу. задлах('хулгана');
2. Хэрэв таны хулганын хэв маягийг ангиас өдөөж байгаа бол $-г ашиглана уу. RemoveClass('hoverCssClass');