jquery防止設備鍵盤重新調整瀏覽器內容大小

我有一個網站，可以擴展一切，以適應用戶的移動設備屏幕。但是，當默認鍵盤出現時，整個站點將重新調整大小。可以將鍵盤覆蓋在網站上，以免扭曲網站或縮放，並專注於用戶觸摸的特定輸入字段。jquery防止設備鍵盤重新調整瀏覽器內容大小

what it should like 這是我認爲會發生或非常相似的效果。

但是，這是發生了什麼事 enter image description here

在右邊的內容保持不變。這有一個固定的寬度，但定位適合：

top:0px; 
bottom:0px; 
left:0px;

頁面大小和縮放的頁面加載。這些是高度和寬度。例如，如果高度是600px，那麼寬度將是800px。

var windowWidth = parseInt(window.innerWidth); 
    var windowHeight = parseInt(window.innerHeight);  
    //set content height 90% of windowHeight 
    var c_height = windowHeight/100 * 95; 
    var c_width = c_height * 1.48; 
    $('#content').css('height',c_height+'px'); 
    $('#content').css('width',c_width+'px');

我碰到類似這樣的東西，但沒有成功：

function updateViews() { 
    $('#page').hide(); 
    if (is_keyboard) { 
     $("#page").hide(); 
    } 
    else { 
     $('#page').show(); 
    } 
} 
window.addEventListener("resize", function() { 
    is_keyboard = (window.innerHeight < initial_screen_size); 
    is_landscape = (screen.height < screen.width); 

    updateViews(); 
}, false); 
/* iOS */ 
$("input").bind("focus blur",function() { 
    $(window).scrollTop(10); 
    is_keyboard = $(window).scrollTop() > 0; 
    $(window).scrollTop(0); 
    updateViews(); 
});

這事我還以爲會被拖欠的設備。

更新：如果它可以幫助所有的頁面內容包裝在一個div;

<div id="body" style="width:100%; height:100%;">

此外，鍵盤不會打開任何其他輸入只有在頂部的酒吧。

來源

2014-04-10 Paul Ledger

試試看，我正在爲手機開發，我的頁面已修復，所以這可能會起作用。

<div id="body" style="width:100%; height:100%; position: fixed">

來源

2014-04-10 21:15:15 Ohjay44

工作分類當瀏覽器重新調整大小時，我還不得不使用函數來重新調整頁面的大小。這種解釋爲什麼只有頁面調整大小 –

是的，你也可以捕捉屏幕上的變化，並防止它調整大小。 – Ohjay44

jquery防止設備鍵盤重新調整瀏覽器內容大小

回答

相關問題