Bagaimana untuk Membuat iFrames Boleh Tatal dalam Safari Mudah Alih?

Memaparkan iFrames dalam Mobile Safari: Panduan Lengkap

Menggabungkan iFrames ke dalam aplikasi web mudah alih boleh menjadi satu cabaran, terutamanya apabila bertujuan untuk menyekat mereka saiz. Walaupun menetapkan atribut ketinggian dan lebar, iframe mungkin kekal tanpa kekangan.

Penyelesaian:

Sisipkan iframe dalam div untuk mengawal dimensinya. Walau bagaimanapun, pendekatan ini memperkenalkan pengehadan tatal dalam iframe.

Untuk mengatasinya, laksanakan strategi berikut:

• Pengintegrasian JavaScript: Letakkan skrip dalam iframe kandungan.
• Pengendalian Acara: Dengar acara sentuhan dalam iframe.
• Komunikasi Ibu Bapa: Maklumkan div induk tentang acara tatal melalui JavaScript.

Kod Contoh:

JavaScript untuk iframe:

setTimeout(function () {
  var startY = 0;
  var startX = 0;
  var b = document.body;
  b.addEventListener('touchstart', function (event) {
    parent.window.scrollTo(0, 1);
    startY = event.targetTouches[0].pageY;
    startX = event.targetTouches[0].pageX;
  });
  b.addEventListener('touchmove', function (event) {
    event.preventDefault();
    var posy = event.targetTouches[0].pageY;
    var h = parent.document.getElementById("scroller");
    var sty = h.scrollTop;

    var posx = event.targetTouches[0].pageX;
    var stx = h.scrollLeft;
    h.scrollTop = sty - (posy - startY);
    h.scrollLeft = stx - (posx - startX);
    startY = posy;
    startX = posx;
  });
}, 1000);

HTML untuk induk div:

<div>

Nota: Apabila kandungan iframe tidak berada di bawah kawalan anda, anda boleh membuat tindanan pada iframe dan melaksanakan fungsi penatalan yang serupa. Walau bagaimanapun, berinteraksi dengan kandungan iframe (cth., mengklik pautan) akan dihadkan.

Pertimbangan Tambahan:

• Dalam iOS 6 dan ke atas, penyelesaian ini tidak lebih lama berfungsi dan tiada alternatif yang boleh dipercayai telah ditemui.
• Pemeriksa Web Jauh (Alat nyahpepijat Safari) kini memerlukan Mac, menjadikan penyahpepijatan pada peranti lebih mencabar.

Atas ialah kandungan terperinci Bagaimana untuk Membuat iFrames Boleh Tatal dalam Safari Mudah Alih?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!