Phát triển Web Android ... Chiều rộng Div (nhiều khả năng văn bản bên trong) đang thay đổi theo pixel dựa trên thu phóng thiết bị

Question

Tôi đã phát triển một ứng dụng giao tiếp với hệ thống cảnh báo khẩn cấp của một tổ chức. Làm thế nào nó hoạt động được, khi có một cảnh báo, trên tất cả các trang web của tổ chức nó sẽ hiển thị một di chuyển marquee ở đầu trang được đặt ở đó bằng cách sử dụng javascript protoype và scriptaculous.

Tất cả điều này hoạt động hoàn hảo trên các trình duyệt máy tính để bàn (IE6-8, Chrome, Safari, Firefox, Opera). Nó cũng hoạt động tốt trên iPhone. Vấn đề duy nhất của tôi là hiển thị trên Android. Trong nghiên cứu vấn đề ban đầu, tôi đã tìm thấy thuộc tính CSS cho thiết bị di động (cụ thể là webkit) -webkit-text-size-tuning, giúp thiết bị di động thay đổi kích thước văn bản khi phóng to và thay đổi hướng màn hình. Tôi đã đặt thuộc tính này thành 'none' như đã nêu trong nhiều bài viết.

Dưới đây là hình ảnh các ảnh chụp màn hình từ trình giả lập Android. Ảnh chụp màn hình bên trái hiển thị độ phóng đại 1x của trang. Khoảng cách giữa mỗi thông điệp là như vậy. Ảnh chụp màn hình bên phải hiển thị trang được phóng to. Các thông báo trùng lặp, khi kích thước văn bản được hiển thị khác nhau và chiều rộng div không đủ rộng để chứa văn bản.

http://www.themonkeyonline.com/spacing-example.jpg

Dưới đây là đoạn code mà đặt div trên trang:

var marquee = new Element('div', { 'id' : 'marquee' + marquee_counter }) 
.setStyle({ 'display' : 'block' 
    , 'WebkitTextSizeAdjust' : 'none' 
    , 'fontSize' : '12px' 
    , 'lineHeight' : '25px' 
    , 'left' : $(marquee_container).getDimensions().width + 'px' }) 
.addClassName('marquee_text') 
.update(marquee_text); 
$(marquee_container).insert(marquee); 

Có điều gì tôi đang thiếu?

Tôi sẽ tiếp tục nghiên cứu sự cố trong thời gian này. Nhờ tất cả mọi người đọc tất cả những điều này.

---

Cập nhật ngắn gọn ... sau khi thử nghiệm thêm, có vẻ như vấn đề không nhất thiết phải dựa trên thu phóng. Có vẻ như vấn đề là chế độ xem. Tôi đã thử nghiệm một số văn bản thực sự dài, và thậm chí thu nhỏ tất cả các con đường ra, nó đã chồng lên nhau. Dường như div chứa văn bản sẽ không tự kích thước lớn hơn cửa sổ.

---

Dưới đây là một ví dụ về mã trong hành động:

http://elliottr.www-dev.seminolestate.edu/alert/

Answer 1

Bạn có thể đăng liên kết đến trang demo nơi sự cố này xảy ra không? Tôi đã cố gắng tái tạo nó trên Milestone của tôi, nhưng không thể.

Answer 2

Hãy thử thiết lập chiều rộng để hạn chế kích thước div của (bạn cũng sẽ cần phải thiết lập position: relative) và thiết lập overflow: hidden , do đó, văn bản sẽ không vượt quá kích thước của div