Adi Pîslaru Adi Pîslaru - 1 year ago 99
CSS Question

Animation not working on Chrome

I made a zoom-effect on a background of a div.
All worked till today when it stopped functioning for Chrome. For every other browser it works perfectly.

here is my code:

.project_image {
width: 582px;
height: 280px;
background-position: center;
-webkit-transition: all .2s linear;
-moz-transition: all .2s linear;
-o-transition: all .2s linear;
-ms-transition: all .2s linear;
transition: all .2s linear;
background-size: 100%;

.project_image:hover {
background-size: 110%;

On Chrome, when i hover the div, the background-size is set instantly to 110%, not slowly as wanted.

edit: fiddle

Answer Source

Add this changes,

.project_image {
background-size: 100% 100%;
.project_image:hover {
background-size: 110% 110%;
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download