How to Create a Zoom Effect and Spin while in hover in Figure certain without jQuery
there was one visitor called Smartpulsa-88 were asked how Creating effects Zoom and Spin while in hover in Figure particular.
I see all the images on this blog muter all.
what if only certain images are going around?
as an example please see below
With Link
Without Zoom Effects and Spin while in hover
and here's how to make it:
1. go to blogger
2. go to the template, and then look for the code ]]> </ b: skin>
3. paste the following code
. Spinning img {-o-transition: all 1.5s ease;-moz-transition: all 1.5s ease;-webkit-transition: all 1.5s ease}. Spinning img: hover {border: 2px solid;-webkit-border- top-left-radius: 20px;
-webkit-border-bottom-right-radius: 20px;
-moz-border-radius-topleft: 20px;
-moz-border-radius-bottomright: 20px;
border-top-left-radius : 20px;
border-bottom-right-radius: 20px;-o-transform: scale (1.2) rotate (360deg) translate (0px);-moz-transform: scale (1.2) rotate (360deg) translate (0px); - webkit-transform: scale (1.2) rotate (360deg) translate (0px);-o-transition: all 1.5s ease;-moz-transition: all 1.5s ease;-webkit-transition: all 1.5s ease}
4. add the following code before and after the code image to be spun Effects
<div class="berputar">
your Image Code
</ div>
Example:
<div class="berputar"> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEji5Zo57BTP2yt8jw0JG_GpMHdiiNB9jrdYio4s0WsL0femeOXz0dB6hNfXCuS_4aja39OXBcv_b7EcLpniwOLiTYclZkHp4vBcYGIV_KjkWlBjNpoS47h_2cT6EERelsRI0_YpJk1L96s/s1600/ico.png" /> </ div>
NB: red code is the code you want to create image effects.
Best of luck.
If you like the post,please share this
|
Get free daily email updates! |
Follow us! 
|
Previous Article
Subscribe to:
Post Comments (Atom)
Share your views...
0 Respones to "How to Create a Zoom Effect and Spin while in hover in Figure certain without jQuery"
Post a Comment