css - Flicker effect on hover transform -
i'm trying make cube 2 sides, 1 image container , other text container. here working plunker
i'm rotating text container using:
.page__text { transform: rotatey(-90deg) translatez(75px); }
and on hover i'm rotating wrapper doing:
.wrapper:hover { transform: rotatey(90deg) translate3d(0, 0, 0); }
the hover works fine, problem when move mouse without moving outside wrapper transform makes flicker effect, if leaving element , transformation canceled
any suggestion appreciated.
regards
when wrapper rotated, no longer has area on can hover (it @ 90 deg view)
change hover state parent, still
.cube-page__item:hover .cube-page__item-wrapper { -webkit-transform: rotatey(90deg) translate3d(0, 0, 0); transform: rotatey(90deg) translate3d(0, 0, 0); }
Comments
Post a Comment