由jquery或javascript頁面可見區域的中心DIV

我的頁面非常大。所以垂直滾動條即將到來。假設我在頁面中間，我可以通過滾動去往&。我想，當我在頁面中間，那麼我的div應該放在頁面可見區域的中心，而不是頁面的中心。我需要在瀏覽器窗口頁面的可見區域中心顯示div。我不確定我能解釋我想說什麼或不說。可見區域意味着我一次可以看到沒有滾動的區域，而不是整個頁面。由jquery或javascript頁面可見區域的中心DIV

所以請指導我如何獲得高度&頁面可見區域寬度不是整頁。指導我如何放置在頁面可見區域的中心，但不是整個頁面的中心。可見區域並不意味着整個頁面，而是我可以在不滾動頁面的情況下一次看到的區域。

我搜索谷歌，發現指導線，我寫了相應的代碼，但它沒有奏效。

所以這裏是我的代碼，根據我的要求不工作。

$(".ui-dialog").animate({ 
left: viewportwidth/2 - $(".ui-dialog").outerWidth()/2, 
top: viewportheight/2 - $(".ui-dialog").outerHeight/2 
}, 1000);

檢測視面積就像

var viewportwidth; 
var viewportheight; 

// the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight 

if (typeof window.innerWidth != 'undefined') { 
    viewportwidth = window.innerWidth, 
    viewportheight = window.innerHeight 
} 

// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document) 

else if (typeof document.documentElement != 'undefined' 
&& typeof document.documentElement.clientWidth != 
'undefined' && document.documentElement.clientWidth != 0) { 
    viewportwidth = document.documentElement.clientWidth, 
    viewportheight = document.documentElement.clientHeight 
} 

// older versions of IE 

else { 
    viewportwidth = document.getElementsByTagName('body')[0].clientWidth, 
    viewportheight = document.getElementsByTagName('body')[0].clientHeight 
}

這並不在FF瀏覽器中運行，並在IE中，無論我在出去了眼我的jQuery的對話將導致問題。

所以請幫我弄清楚如何在頁面的可見區域顯示div。

謝謝

來源

2011-10-29 Keith Costa

您不需要JavaScript就可以了。你可以使用「position：fixed」。

例如：http://jsfiddle.net/hENGL/

來源

2011-10-29 19:29:40

如何做到這一點或設置jQuery的所有CSS。 –

你能更具體一點你想達到什麼嗎？如果我需要做一個彈出窗口，我可能會做到以下幾點：將lightbox html添加到開始或文檔末尾的頁面，將lightbox設置爲一個類（例如class =「lightbox」），然後添加class css到我的css文件（例如，但添加以下「display：none;」以默認隱藏它），然後我需要顯示lightbox我將使用以下命令使用JQuery執行此操作：$（「。yourclassname」）。顯示（）; –

儘管這給OP提供了一個可行的解決方案，但它並沒有真正回答這個問題。這種建議應該是一個評論，而不是被接受的答案。 –

由jquery或javascript頁面可見區域的中心DIV

回答

相關問題