วิธีการปรับตัว IFRAME ในเค้าโครงการตอบสนองของเว็บ

ในรูปแบบการตอบสนองเราควรระวังเกี่ยวกับความกว้างและความสูงของแอตทริบิวต์ความกว้างและความสูงขององค์ประกอบ iframe แต่เมื่อความกว้างหรือความสูงของบล็อกหรือความสูงมีขนาดเล็กกว่าความกว้างหรือความสูงของ iframe ปรากฏการณ์ของ iframe องค์ประกอบล้น

iframe ที่ล้นล้นนี้จะทำลายเค้าโครงของหน้า เราสามารถใช้วิธีหนึ่งในการสร้างองค์ประกอบ iframe ก็ตอบสนองและรอดู

องค์ประกอบ IFRAME นั้นไม่สามารถหดกลับได้เว้นแต่ความกว้างที่แสดงโดย JS ที่แสดง แต่เราสามารถห่อ iframe ผ่านองค์ประกอบ iframe-container และในเวลาเดียวกันทำให้ความกว้างขององค์ประกอบ iframe-container ที่เต็มไปด้วยความกว้างที่มีบล็อกและขึ้นอยู่กับอัตราส่วนความยาวและความกว้างของ iframe ขององค์ประกอบ iframe-container

ในความเป็นจริงสาระสำคัญของวิธีนี้อยู่ในการตั้งค่าคุณสมบัติการขยายด้านล่างขององค์ประกอบ iframe-container เนื่องจากการตั้งค่าเปอร์เซ็นต์สำหรับการขยายด้านล่างจะถูกนำมาเปรียบเทียบกับความกว้างขององค์ประกอบหลักหากเปอร์เซ็นต์ของแอตทริบิวต์ความสูงถูกตั้งค่าจะถูกเปรียบเทียบกับความสูงขององค์ประกอบหลัก สามารถตั้งค่าแอตทริบิวต์สำหรับการรองลงด้านล่างเท่านั้น ด้วยวิธีนี้คุณจะต้องสร้างองค์ประกอบ iframe ที่เต็มไปด้วย iframe-container