Jak udělat animaci přiblížení obrázku při najetí myši

Animace při najetí myši na prvek je populární a často používaný způsob, jak návštěvníkovi web zatraktivnit.

Mezi nejpopulárnější animace patří přiblížení obrázku při najetí kurzoru myši.

Dosáhnout této animace u Divi šablony jde vcelku snadno, jen přidáním pár řádků kódu do pole pro vlastní CSS nebo child šablony.

.et_pb_image img {  
  transition:all 0.5s; 
  -moz-transition:all 0.5s; 
  -webkit-transition:all 0.5s; 
}
  
.et_pb_image:hover img {
  transform:scale(1.05);
  -moz-transform: scale(1.05);
  -webkit-transform:scale(1.05);
}

.et_pb_image {
  overflow:hidden;
}

Výše zobrazený kód automaticky přidá animaci přiblížení na všechny obrázky vložené přes modul Obrázek.

V případě, že chcete animaci použít jen v některých případech, stačí třídu et_pb_image nahradit nějakou vlastní a tu pak používat, když chcete animaci přidat.