Здравствуйте, давайте создадим эффект вспышки при наведении на изображение при помощи css3.

Скачать исходники для статьи можно ниже

Html код:

<img class="flash" src="/wp-content/uploads/2018/06/fox.jpg" />
<br/>
<img class="flash" src="/wp-content/uploads/2018/06/cat.jpg" />

Css код:

.flash:hover {
  opacity: 1;
  -webkit-animation: flash 1s;
  animation: flash 1s;
}

@-webkit-keyframes flash {
  0% {  opacity: .3;  }
  100% { opacity: 1; }
}
@keyframes flash {
  0% { opacity: .3; }
  100% { opacity: 1;  }
}