В теме одно сообщение

[tutkypi]

Здравствуйте, на главной medkaz.ru  есть три шестиугольника(соты) при наведении они поворачиваются,но этого не происходит в firefox.Помогите решить эту проблему.





Аккаунт SL-325231

[Vaccina]

В main.css найдите:

.rotation {background: none;-webkit-perspective: 600px;-moz-perspective: 600px;perspective: 600px;}
.rotation .default, .rotation .front-end {overflow: hidden;position: relative;-webkit-transform: rotateX(0deg) rotateY(0deg);-webkit-transform-style: preserve-3d;-webkit-backface-visibility: hidden;-moz-transform: rotateX(0deg) rotateY(0deg);-moz-transform-style: preserve-3d;-moz-backface-visibility: hidden;transform: rotateY(0deg);-webkit-transition: all .6s ease-in-out;-moz-transition: all .6s ease-in-out;transition: all .6s ease-in-out;z-index: 24;}
.rotation .default {-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
.rotation.hover .default, .rotation.hover .front-end {z-index: 35;-webkit-transform: rotateY(180deg);-moz-transform: rotateY(180deg);transform: rotateY(180deg);-webkit-transition-delay: .2s;-moz-transition-delay: .2s;transition-delay: .2s;}
.rotation .product-hover, .rotation .back-end {display: block;height: inherit;-webkit-transform: rotateY(-180deg);-webkit-transform-style: preserve-3d;-webkit-backface-visibility: hidden;-moz-transform: rotateY(-180deg);-moz-transform-style: preserve-3d;-moz-backface-visibility: hidden;transform: rotateY(-180deg);-moz-transition: all .6s ease-in-out;-webkit-transition: all .6s ease-in-out;transition: all .6s ease-in-out;width: 100%;z-index: 13;}
.rotation.hover .product-hover, .rotation.hover .back-end {z-index: 46;-webkit-transform: rotateX(0deg) rotateY(0deg);-moz-transform: rotateX(0deg) rotateY(0deg);transform: rotateY(0deg);-webkit-transition-delay: .2s;-moz-transition-delay: .2s;transition-delay: .2s;}
.rotation .product-image:hover > img {opacity: 1;filter: alpha(opacity=100);}

замените на:

.rotation {background: none;-webkit-perspective: 600px;-moz-perspective: 600px;perspective: 600px;}
.rotation .default, .rotation .front-end {overflow: hidden;position: relative;-webkit-transform: rotateX(0deg) rotateY(0deg);-webkit-transform-style: preserve-3d;-webkit-backface-visibility: hidden;-moz-transform: rotateX(0deg) rotateY(0deg);-moz-transform-style: preserve-3d;-moz-backface-visibility: hidden;transform: rotateY(0deg);-webkit-transition: all .6s ease-in-out;-moz-transition: all .6s ease-in-out;transition: all .6s ease-in-out;z-index: 24;}
.rotation .default {-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
.rotation:hover .default, .rotation:hover .front-end {z-index: 35;-webkit-transform: rotateY(180deg);-moz-transform: rotateY(180deg);transform: rotateY(180deg);-webkit-transition-delay: .2s;-moz-transition-delay: .2s;transition-delay: .2s;}
.rotation .product-hover, .rotation .back-end {display: block;height: inherit;-webkit-transform: rotateY(-180deg);-webkit-transform-style: preserve-3d;-webkit-backface-visibility: hidden;-moz-transform: rotateY(-180deg);-moz-transform-style: preserve-3d;-moz-backface-visibility: hidden;transform: rotateY(-180deg);-moz-transition: all .6s ease-in-out;-webkit-transition: all .6s ease-in-out;transition: all .6s ease-in-out;width: 100%;z-index: 13;}
.rotation:hover .product-hover, .rotation:hover .back-end {z-index: 46;-webkit-transform: rotateX(0deg) rotateY(0deg);-moz-transform: rotateX(0deg) rotateY(0deg);transform: rotateY(0deg);-webkit-transition-delay: .2s;-moz-transition-delay: .2s;transition-delay: .2s;}
.rotation .product-image:hover > img {opacity: 1;filter: alpha(opacity=100);}