测试地址:
https://www.oxyry.com/test/img.html
点 Move 后,图片在动画移动中消失了!动画完成后才出来。
这个在别的浏览器没问题,在我的 iPhone 13 Safari 中图片会消失。
虽然 Safari 成吨的 Bug,但这个奇怪在于大部分移动图片操作不消失,但移动到有些位置会消失,想不通为什么。
我的 App 中很多这类移动,最近有点崩溃因为想不到绕过这个 Bug 的方法,你们碰到过吗怎么解决的?
文件源码:
<meta name="viewport" cOntent="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"> <style> body { margin: 0; } a[href], button { padding: 0.5em; font-size: xx-large; } #root { width: 320px; height: 300px; overflow: hidden; } #pic { transform: translateX(-1000px) scale(2.5); transform-origin: left top; } </style> <button id=btnMove>Move</button> <div id="root"> <img id=pic src="https://s3.ifanr.com/wp-content/uploads/2022/01/ms_070621_item1_AI_BehavioralHealth.jpg"> </div> <script> btnMove.Onclick= () => { pic.style.transition = 'transform 1000ms' pic.style.transform = `translateX(-1100px) scale(2.5)` } </script> 