Publicado 26 mayo 2016 - 19:24
Hola, tengo una web que con CSS no sé por qué, pero Chrome desde que actualicé no funciona bien las animaciones de zoom CSS transiciones. A ver si podéis echarme un cable, por lo menos para saber si es problema general o sólo mío. Me sorprende que en otras versiones anteriores de Chrome si que funciona bien. Pero en esta última da esos fallos.
Gracias.
Publicado 31 mayo 2016 - 20:44
Lei que hay algunos problemas de transiciones con Chrome que son generados por la representacion del navegador cuadno usa o no aceleracion de Hardware. Lo cual puedes habilitarlo en el navegador o buscar en la especificacion CSS para Chrome que obligue la aceleracion de hardware.
Espero haberte dado alguna linea para solucionar.
Suerte!
Publicado 16 junio 2016 - 20:33
Lei que hay algunos problemas de transiciones con Chrome que son generados por la representacion del navegador cuadno usa o no aceleracion de Hardware. Lo cual puedes habilitarlo en el navegador o buscar en la especificacion CSS para Chrome que obligue la aceleracion de hardware.
Espero haberte dado alguna linea para solucionar.
Suerte!
Muchas gracias por tu respuesta Javx, estoy ahí pegándome con ello todavía. Veo que ha sido un bug general de Google. Y que los que lo teníamos puesto con un tipo de forma ya no lo coge bien. Aunque hay solución para ello.
Publicado 16 junio 2016 - 20:37
Este es el código que funciona para hacer zoom y transcición en CSS, no es muy complicado.
.image-box{
width:300px;
overflow:hidden;
}
.image {
width:300px;
height:200px;
background: url("http://lorempixel.com/300/200");
background-position:center;
transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
-webkit-transition: all 1s ease;
-o-transition: all 1s ease;
}.image:hover {
transform: scale(1.5);
-moz-transform: scale(1.5);
-webkit-transform: scale(1.5);
-o-transform: scale(1.5);
-ms-transform: scale(1.5); /* IE 9 */
-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1.5, M12=0, M21=0, M22=1.5, SizingMethod='auto expand')"; /* IE8 */
filter: progid:DXImageTransform.Microsoft.Matrix(M11=1.5, M12=0, M21=0, M22=1.5, SizingMethod='auto expand'); /* IE6 and 7 */}