在ipad上重新定位隱藏div

Question

我有一個隱藏的div，當點擊率報價按鈕時，它變成了一個模式窗口。它似乎在我的筆記本電腦上運行良好，但它不能正確定位在我的iPad 2上。在橫向模式下，它完全不顯示。縱向顯示時，顯示在頁面底部，其餘內容下方。

我不確定發生了什麼。這裏是的javascript我使用：

function openquote(){ 
var w = 425; 
var h = 350; 
myleft = (window.screen.width)?(window.screen.width-w)/2:100; 
mytop = (window.screen.height)?(window.screen.height-h)/4:100; 
window.document.getElementById('quotediv').style.marginTop = mytop + 'px'; 
window.document.getElementById('quotediv').style.marginLeft = myleft + 'px'; 
window.document.getElementById('overlay').style.display = 'block'; 
window.document.getElementById('quotediv').style.display = 'block'; 

的CSS是：

#quotediv { 
display:none; 
z-index:99; 
height:338px; 
width:323px; 
position:fixed; 
border-radius:10px; 
border:2px solid #FFF; 
box-shadow: 2px 2px 4px #989898; 
background-color:#8b0202; 
} 

您可以在http://www.ntxprospec.com/services.html

感謝您的幫助查看頁面。

Answer 1

我在瀏覽器上測試了頁面，調整了它的大小，直到它突然從屏幕上消失，所以我能夠在瀏覽器中重現問題。當我將您的保證金頂部和保證金餘額改爲頂部和左側時，問題就消失了。缺點是即使變得可見，模式也不居中，並且使用JavaScript來居中元素實際上有點矯枉過正。我建議this post on CSS Tricks如何用CSS做同樣的事情。如果你使用這種方法，你所需要做的就是顯示/隱藏JavaScript功能。