تصف هذه المقالة الحل القابل للتكيف للغاية لـ IFRAME في المتصفح المتقاطع ، وهو أمر عملي للغاية. شاركه للرجوع إليه. الطرق المحددة هي كما يلي:
تستخدم هذه الطريقة jQuery ، لذلك يجب إدخال jQuery في صفحة SRC من iframe.
الصفحة الأصل بسيطة نسبيًا ، بما في ذلك الكود التالي:
<iframe id = "if1" scrolling = "no" src = "2.html"> </frame>
الرمز في صفحة SRC من iframe كما يلي:
<script type = "text/javaScript"> resizeContent () {$ (window.parent.document) .find ("#if1"). الارتفاع ($ ("#content"). height ()) ؛} دالة show400 () {if ($ ( $ ("#test400"). CSS ("Display" ، "") ؛ ResizeContent () ؛ } آخر {$ ("#test400"). css ("display" ، "none") ؛ ResizeContent () ؛ }} $ (وثيقة) .READER (function () {resizeContent () ؛}) </script> <div id = "level11"> <div onClick = "test400 ()"> </viv> <div> <a href = "productlist.htm" HREF = "ProductCategory.html"> الارتباط التشعبي </a> </viv> <viv> <A Href = "ProductCategory.html"> الارتباط التشعبي </a> </div> <viv> <a href = "productCategory.html"> hyperlink </a> </div> <viv id = "test400" style = "display: none ؛ height: 400px ؛"> </viv> <viv> <a href = "orders.html"> hyperlink </a> </viv> <viv> <a href = "keywords.html"> hyperlink </a> </viv> <i div> <a href = "#" href = "#"> ارتباط تشعبي </a> </viv> <viv> <a href = "#"> ارتباط تشعبي </a> </viv> <viv> <a href = "#"> hyperlink </a> </iv> <viv> <div> <a href = "#" /> < /div>ملحوظات:
داخل
$ (window.parent.document) .find ("#if1"). الارتفاع ($ ("#content"). height ()) ؛كانت هذه الجملة في الأصل:
$ (window.parent.document) .find ("#if1"). الارتفاع ($ (document) .height ()) ؛يمكن تحقيق الارتفاع التكيفي ، ولكن لا يمكن تحقيق تكيف التحجيم. نظرًا لأن ارتفاع المستند هو أعلى ارتفاع تم عرضه ، إذا قمت بالنقر على التوسع هنا ، فلن يتقلص IFRAME ، ولكنه سيعرض فقط أعلى ارتفاع تم عرضه .
لذلك نحتاج هنا إلى استخدام حاوية طبقة أولياء الأمور ، أي أحدث رمز. هذا يسمح للتكيف.
أعتقد أن الوصف في هذه المقالة له قيمة مرجعية معينة لبرمجة jQuery للجميع.