2016-03-16 60 views
1

我有覆蓋整個屏幕的背景圖片。它在網絡中像一個魅力。然而,當我點擊移動瀏覽器中的輸入字段時,背景會發生變化(我相信),並顯示白色。由於我的輸入字段也是白色的,所以當事情變得混亂時,我看不到它們。移動瀏覽器中的背景問題

在單擊輸入字段之前添加兩種狀態的屏幕截圖,然後在移動設備上單擊它。

代碼在這裏:

<body class="details_step1-1"> 
    <div> 
    ........... 
    </div> 
</body> 

CSS的位置:

.details_step1-1{ 
    background-image: url("../images/img_foldbg.png"); 
    background-position: top center; 
    background-repeat: no-repeat; 
    background-size: cover; 
    height:100%; 
    -webkit-background-size:cover; 
    -moz-background-size:cover; 
    -o-background-size:cover; 
} 

受審FIXES: 1.添加最小高度到背景圖像,HTML,體爲100%一起以及單獨。 2.以100vh的高度添加背景圖片,html和body。在你的HTML標記,你的身體標籤齊備的汽車,這將解決您的白色空間的問題:

Before Clicking on Input Field

After Clicking on Input Field

+1

你使用什麼樣的手機?它幾乎看起來像鍵盤推高了.details_step1-1 div,這將解釋爲什麼鍵盤打開時它仍然居中背景圖像。看起來好像還有一個z-indexes衝突在進行,這將解釋爲什麼你的輸入和「編輯」鏈接顯示在鍵盤的白色空間之上。儘管沒有訪問該網站但很難診斷。 –

回答

0

您可以將溢出。

+0

謝謝..明天再試試這個,讓你知道。 :) –

+0

謝謝你。解決了我的問題。你們在這裏堆棧哇我。 –

+0

任何時間人!很高興我能幫上忙。 –

相關問題