คำถามติดแท็ก translate-animation

ฉันมี CSS บางอย่างที่วางเมาส์บนเอฟเฟกต์การเปลี่ยน CSS จะย้าย div ปัญหาดังที่คุณเห็นในตัวอย่างคือการtranslateเปลี่ยนแปลงมีผลข้างเคียงที่น่ากลัวในการทำให้ภาพในการเลื่อน div เคลื่อนไหวโดย 1px ลง / ขวา (และอาจจะปรับขนาดเล็กน้อยเลยหรือ?) เพื่อให้ปรากฏออกนอกสถานที่และ ออกจากโฟกัส ... ความผิดพลาดดูเหมือนว่าจะนำมาใช้ตลอดเวลาที่ใช้เอฟเฟกต์โฮเวอร์และจากขั้นตอนการทดลองและข้อผิดพลาดฉันสามารถพูดได้อย่างปลอดภัยเท่านั้นดูเหมือนว่าจะเกิดขึ้นเมื่อการเปลี่ยนแปลย้าย div (เงากล่องและความทึบก็ใช้เช่นกัน ข้อผิดพลาดเมื่อลบออก) ปัญหาดูเหมือนจะเกิดขึ้นเฉพาะเมื่อเพจนั้นมีแถบเลื่อน ดังนั้นตัวอย่างที่มีเพียงอินสแตนซ์เดียวของ div จึงใช้ได้ แต่เมื่อมีการเพิ่ม div ที่เหมือนกันอีกครั้งและหน้าเว็บต้องการแถบเลื่อนปัญหาจะเกิดขึ้นอีกครั้ง ...

150 css  image  hover  positioning  translate-animation 

บล็อกจำนวนมากแสดงให้เห็นถึงประสิทธิภาพที่เพิ่มขึ้นในการ 'หลอกล่อ' GPU ให้คิดว่าองค์ประกอบนั้นเป็น 3 มิติโดยใช้transform: translateZ(0)เพื่อเร่งความเร็วของภาพเคลื่อนไหวและการเปลี่ยนภาพ ฉันสงสัยว่ามีผลต่อการใช้การแปลงนี้ในลักษณะต่อไปนี้หรือไม่: * { -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); }

96 performance  css  translate-animation