บังคับให้วาดใหม่ / รีเฟรช DOM บน Chrome / Mac
ในบางครั้ง Chrome จะแสดง HTML / CSS ที่ถูกต้องอย่างสมบูรณ์ไม่ถูกต้องหรือไม่ถูกเลย การขุดผ่านผู้ตรวจสอบ DOM นั้นเพียงพอที่จะทำให้เกิดข้อผิดพลาดในวิธีการและวาดใหม่ได้อย่างถูกต้องดังนั้นจึงเป็นกรณีที่มาร์กอัปเป็นสิ่งที่ดี สิ่งนี้เกิดขึ้นบ่อยครั้ง (และคาดการณ์ได้) เพียงพอในโครงการที่ฉันกำลังทำอยู่ซึ่งฉันได้วางโค้ดไว้เพื่อบังคับให้วาดใหม่ในบางสถานการณ์ ใช้ได้กับเบราว์เซอร์ / ระบบผสมส่วนใหญ่: el.style.cssText += ';-webkit-transform:rotateZ(0deg)' el.offsetHeight el.style.cssText += ';-webkit-transform:none' เช่นเดียวกับปรับแต่งคุณสมบัติ CSS ที่ไม่ได้ใช้แล้วขอข้อมูลบางอย่างที่บังคับให้วาดใหม่จากนั้นคลายคุณสมบัติ น่าเสียดายที่ทีมงานที่อยู่เบื้องหลัง Chrome สำหรับ Mac นั้นดูเหมือนจะพบวิธีที่จะชดเชยความสูงนั้นได้โดยไม่ต้องวาดใหม่ ดังนั้นการฆ่าแฮ็คที่มีประโยชน์อย่างอื่น จนถึงตอนนี้สิ่งที่ดีที่สุดที่ฉันได้รับเพื่อให้ได้ผลเช่นเดียวกันกับ Chrome / Mac คือความอัปลักษณ์ชิ้นนี้: $(el).css("border", "solid 1px transparent"); setTimeout(function() { $(el).css("border", "solid 0px transparent"); }, 1000); ในขณะที่จริงบังคับให้องค์ประกอบที่จะกระโดดเล็กน้อยจากนั้นทำใจให้สบายวินาทีและกระโดดกลับ …