2012-03-21 42 views
6

Tôi đang tìm cách chính xác cách để đảm bảo nội dung được tiết lộ động hiển thị sau khi cuộn trong iframe trên ipad/iOS5.iframe trên iOS (iPad) vấn đề cắt xén nội dung

Oh iframe và iPad - bạn là một loại hạt dẻ cũ tuyệt vời. Tôi biết rằng:

  • iPad mở rộng iframe với chiều cao đầy đủ các nội dung bên trong nó (hầu như nó đã được sử dụng "seamless" tài sản HTML5, nhưng không hoàn toàn vì nó không kế thừa phong cách hoặc sự kiện từ công ty mẹ) . Kỳ lạ, gây phiền nhiễu cho nhiều người, nhưng đúng.
  • <iframe height="100%"> Do đó, vô dụng vì nó kích thước nội dung của nó không chứa
  • tôi cần phải quấn iframe của tôi trong một div - a la

    <div id="wrapper" style="-webkit-overflow-scrolling:touch;overflow:auto;"> 
    <iframe width="100%" height="100%" src="about"blank"></iframe> 
    </div> 
    
  • hoặc khác giới thiệu một số trickery để thiết lập các cuộn vị trí của khung (mà tôi nghĩ là dựa trên thủ thuật nêu tại this article)

vấn đề của tôi là nội dung đó là động sh sở hữu bên trong phần khung nội tuyến (ví dụ: các tab jquery, accordion, v.v.) có thể khiến trình duyệt cắt nội dung ở mức hiển thị của trang.

Ví dụ: nếu "tab" của tôi là phần lớn xuống theo chế độ xem có thể nhìn thấy bên trong khung nội tuyến và tôi thực hiện cuộn hai ngón tay (hoặc thực hiện thao tác vuốt một ngón tay) sau khi nội dung đó được cuộn vào chế độ xem, một số nội dung của nó trước đó không rút ra vẫn chưa được vẽ. Nhấp vào tab thứ hai/ngược lại sẽ khiến nội dung xuất hiện như thể trang không vẽ nội dung ngoài màn hình. Sau đó, nếu sau đó tôi cuộn lên trên cùng của trang, nội dung sẽ không được rút ra để bắt đầu trang (mà trước đây có thể nhìn thấy). Cuộn trang lên xuống một vài lần với một thanh cuộn hai ngón tay giải quyết sự cố.

Tôi đã đọc this article tuyên bố rằng sự cố đã được khắc phục. Nhưng nó dường như không hoàn toàn cố định; và vẫn không giải quyết được vấn đề bởi vì bạn phải quấn khung nội tuyến trong div và đặt thanh cuộn trên div đó, trình duyệt trên máy tính để bàn có thể hiển thị thanh cuộn kép tùy thuộc vào cách chúng diễn giải overflow:auto.

p.s. Tôi đang sử dụng trang HTML5 boilerplate cả bên trong và bên ngoài khung nội tuyến, với cài đặt chế độ xem cổng meta chính xác.

+0

Bạn có tìm thấy giải pháp nào trong khi đó không? Đối mặt với cùng một vấn đề trên nền tảng của tôi, tôi đang làm việc ... – YvesR

+2

Tôi thấy rằng việc thử sử dụng thẻ XHTML1.1 tuân thủ thay vì