transform:rotate(90deg) 之后鼠标无法触摸或者是触摸之后又断开,一直断断续续的,使用css的hover或者是JS的mouseenter事件会执行多次导致一卡一卡的。解决方法是改为89即可。
使用 rotateX(90deg) 会出现Bug
div:{ height:84px; width:100px; background:red; transform-style:preserve-3d; transition: .4s; transform-origin: center; prespective:10000px; transform: rotateX(0deg) translateZ(0); } div:hover{ transform: rotateX(90deg) translateZ(0); }
效果图
上面的效果是会一直抖动,使用JS事件的mouseenter 会一直执行,正常的话一会执行一次
把90改为89即可
div:hover{ transform: rotateX(86deg) translateZ(0); }
效果图
现在不会抖动了,JS事件也正常了
本文暂时没有评论,来添加一个吧(●'◡'●)