ВРАЩЕНИЕ КАРТИНКИ ПРИ НАВЕДЕНИИ

С помощью этого эффекта можно добиться красивого вращения картинки при наведении. Такой эффект можно использовать для галереи, или для того, чтобы привлечь внимание к определенному элементу на сайте.

Код HTML

<div class="beauty-rotate">
  <img src="image.jpg" alt="" />
</div>

Код CSS

.beauty-rotate {
  width: 300px;
  height: 300px;
  border: 4px double #bd6c46; /* Рамка */
  overflow: hidden;
  -webkit-transition: all 0.5s ease;
          transition: all 0.5s ease;
} 
.beauty-rotate:hover {
  border-radius: 50%;
  -webkit-transform: rotate(360deg);
          transform: rotate(360deg);
}