Rumah  >  Artikel  >  pembangunan bahagian belakang  >  Bagaimana untuk Mengubah Saiz Iframe Secara Dinamik Tanpa Ajax atau PHP?

Bagaimana untuk Mengubah Saiz Iframe Secara Dinamik Tanpa Ajax atau PHP?

Linda Hamilton
Linda Hamiltonasal
2024-10-27 02:10:02689semak imbas

How to Dynamically Resize Iframes Without Ajax or PHP?

Saiz Iframe Dinamik: Mengatasi Kekangan Ketinggian

Apabila membenamkan kandungan luaran dalam iframe, adalah penting untuk melaraskan ketinggian secara dinamik untuk menghapuskan bar skrol yang tidak diperlukan . Untuk mengelakkan isu kebolehaksesan dan mengekalkan pengalaman satu halaman yang lancar, kami akan meneroka pilihan di luar Ajax atau PHP.

Penyelesaian: Komunikasi Merentas Domain dengan JavaScript

Malangnya , Ajax dan PHP gagal dalam senario ini disebabkan oleh sekatan merentas domain. Sebaliknya, kami akan menggunakan JavaScript untuk memulakan interaksi merentas domain antara kandungan iframe dan halaman induk.

Langkah 1: Pencetus Pengiraan Ketinggian daripada Halaman Berbingkai

  • Suntikan kod ini ke dalam badan iframe:

    <body onload='parent.resizeIframe(document.body.scrollHeight)'>

Langkah 2: Ubah Saiz Fungsi dalam Halaman Induk

  • Dalam JavaScript halaman induk, tentukan fungsi untuk melaraskan ketinggian iframe:

    function resizeIframe(newHeight)
    {
      document.getElementById('blogIframe').style.height = parseInt(newHeight,10) + 10 + 'px';
    }

Mengendalikan Ketinggian dan Pemuatan Awal

  • Pada mulanya, iframe akan mempunyai ketinggian lalai.
  • Tambah imej pemuatan yang kelihatan pada mulanya dan sembunyikannya apabila fungsi resizeIframe dijalankan.
  • Ini mewujudkan ilusi saiz semula dinamik.

Penghadan dan Pertimbangan

Penyelesaian beroperasi dalam domain yang sama. Untuk pembenaman merentas domain, pertimbangkan untuk menggunakan skrip proksi PHP atau membenamkan suapan RSS blog secara terus.

Atas ialah kandungan terperinci Bagaimana untuk Mengubah Saiz Iframe Secara Dinamik Tanpa Ajax atau PHP?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn