2013-09-22 55 views
12

Tôi gặp sự cố với ứng dụng web iPhone toàn màn hình (được lưu vào màn hình chính) trên iOS7.biểu mẫu tràn trên webkit được cuộn trên ứng dụng web toàn màn hình iOS 7

Thông thường, khi một đầu vào được chọn, nó đã được cuộn vào chế độ xem phía trên bàn phím.

Tuy nhiên, điều này dường như không xảy ra trên iOS7 để di chuyển DIV trong ứng dụng web toàn màn hình.

Do đó, khi DIV sử dụng "-xuyển tràn tràn trên mạng: chạm vào" và đầu vào ở nửa dưới của màn hình được nhấp, bàn phím được kích hoạt nhưng đầu vào không cuộn lên.

VÀ, tại thời điểm đó, đầu vào sẽ không phản hồi bất kỳ sự kiện onFocus nào khác mà tôi có thể cuộn lên bằng.

Bất cứ ai đã xem giải pháp thay thế?

Trả lời

17

Cập nhật thẻ meta chế độ xem đã sửa nó cho tôi.

tôi đã thay đổi này:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" /> 

Để này:

<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, target-densityDpi=device-dpi" /> 

height=device-height là việc sửa chữa thực tế (mà không có nó các khung nhìn được thay đổi kích cỡ để phù hợp với bàn phím).

+1

Tuyệt vời! Đặt chiều cao cho chiều cao thiết bị đang phá vỡ một số thứ khác trên ứng dụng của chúng tôi (chúng tôi có thanh chân trang cố định di chuyển lên trên bàn phím khi chiều cao thiết bị được sử dụng, vì iOS7 thu nhỏ chiều cao thiết bị khi bàn phím hiển thị). NHƯNG. . . thiết lập nó một cách rõ ràng cho một cái gì đó rất lớn, như 10000 pixel làm cho nó chủ yếu là làm việc, tiết kiệm cho rất nhiều khoảng trắng thêm. (Khoảng trống thừa chắc chắn là ít tệ nạn hơn.) –

+2

mật độ mục tiêuDpi = device-dpi không được dùng nữa và bạn có thể easaly loại bỏ nó. https://petelepage.com/blog/2013/02/viewport-target-densitydpi-support-is-being-deprecated/ –

+0

Điều này phù hợp với tôi, nhưng sau đó tôi gặp phải vấn đề này: http://stackoverflow.com/questions/11804428/jquery-mobile-height-issue-cho-iphone-web-app-giả định-page-height-of-480-instea –

0

Nó hoạt động trên WebApp của tôi bằng cách xóa cài đặt độ cao.