使用媒體查詢時Android鍵盤無法打開

我有一個包含底部搜索框的移動網站。我還使用媒體查詢在縱向模式中隱藏內容並以橫向模式顯示。使用媒體查詢時Android鍵盤無法打開

但是，在Android設備上，當我點擊搜索字段時，鍵盤打開，然後立即關閉，使其無法輸入框中。

這在iOS中不是問題。

該頁面在這裏可以查看 - http://so.ajcw.com/android-keyboard.htm這裏是完整的頁面代碼：

<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.2//EN" "http://www.openmobilealliance.org/tech/DTD/xhtml-mobile12.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
<head> 
    <meta http-equiv="Content-type" content="text/html; charset=UTF-8"> 
    <title>Erroring search field</title> 

    <style>  
    .address { display: none; } 

    @media only screen and (orientation: landscape) { 
     .address { display: block; } 
    } 
    </style> 

</head><body> 

<h3>Venue 1</h3> 
<p>Cuisine</p> 
<p>Price</p> 
<p>Rating</p> 
<p class="address">Address</p> 

<h3>Venue 2</h3> 
<p>Cuisine</p> 
<p>Price</p> 
<p>Rating</p> 
<p class="address">Address</p> 

<form><input type="text"></form> 

</body></html>

件事是我試過

如果我只有一個地點，或者如果我將搜索向上移動問題消失（這不是一個解決方案，只是一個觀察）。
我試圖改變的DOCTYPE - 一個HTML5文檔類型稍有變化，該功能鍵盤依然是第二點擊之後，但同樣不能解決問題。

* 編輯 *

這似乎是針對特定瀏覽器。一箇舊的Android手機沒有問題，我的Android（HTC Desire）默認瀏覽器似乎也不是，但它確實發生在Dolphin HD中。

來源

2011-09-22 ajcw

這是發生在我的摩托羅拉凱旋。 –

使用Adam's research問題是通過使用方向，避免解決。這對我的作品的溶液從this CSS3 'boilerplate'拍攝，並使用最小和最大寬度，像這樣：

@media only screen and (max-width: 320px) { 
    .address { display: none; } 
} 

@media only screen and (min-width: 321px) { 
    .address { display: block; } 
}

這可以在這裏的行動中可以看出 - http://so.ajcw.com/android-keyboard-solved.htm（http://goo.gl/nNIm9）

但是這種解決方案並不理想，因爲隨着設備分辨率的改變，使用固定尺寸最終會破裂

來源

2011-10-10 09:29:18 ajcw

這不是一個解決方案，但有點告訴我想。當我添加float：left和position：relative時，我得到了更改doc類型時所描述的行爲。在第二次點擊時，鍵盤顯示出景觀項目也顯示出來。看起來像一個方向上的呃逆：Android的風景。

.address {display:none} 

@media only screen and (orientation: landscape) { 
    .address {color:red;display:block;float:left;position:relative} 
}

鑑於這些天在屏幕尺寸上的巨大差異。我建議遠離使用方向，而是使用最大和最小寬度。

更新：好吧我認爲我證實，至少在我的摩托羅拉凱旋在android瀏覽器，方向：景觀不完全支持。我用下面，然後點擊在縱向視圖中的文本框中觸發的景觀風格，顯示...

@media only screen and (orientation: landscape) { 
    BODY {background:pink} 
}

來源

2011-10-03 19:09:23

我最好的猜測是，無論出於何種原因，當瀏覽器鍵盤打開時，android瀏覽器認爲它處於橫向模式。 –

感謝亞當 - 你的假設：方向：景觀沒有得到充分的支持導致我找到另一種解決方案。 – ajcw

使用媒體查詢時Android鍵盤無法打開

回答

相關問題