在頁面頂部插入div而不覆蓋使用javascript

基本上我有一段Javascript代碼，我希望能夠給人。因此，以下情況屬實：

我無法控制他們決定放入代碼段的紙張（出於各種原因） - 它可能位於中間，最後，任何地方。

所有代碼段都會在頁面頂部放置一個小DIV。目前，我做以下（這是片段）：

<div id="mydiv" style="display:none; position: fixed; top: 0; left: 0; z-index: 999; width: 100%; height: 40px; background-color:red; text-align:center; color:white"><br>Message Inside Div</div> 
<script>if (Condition) { document.getElementById("mydiv").style.display = "block"; }</script>

現在，一個可行的治療，當「條件」是真實的，它顯示了格。但是，使用此方法時，它會覆蓋div，並將其固定到頁面的頂部。

但是，我也想這樣做，以便div插入頁面的頂部，但與正常頁面一樣滾動，不覆蓋頂部的內容（IE：它將內容壓下它出現）。

關於我該怎麼做的任何想法請記住：我沒有任何訪問他們的頁面（我什至不知道頁面上還有什麼），我給他們的片段可以去任何地方這一頁。

來源

2013-11-21 Chris Jones

我猜你要麼需要的全部內容裹身到另一座與上邊距或通過直接改變機關作風javascript並在頂部添加一個與您的div高度相匹配的邊距。 – rita

感謝麗塔 - 上邊緣的身體風格會工作，但我不想真的這樣做，以防他們已經有其他原因設置。什麼是理想的將插入我的div直接後面的開放身體標籤，但我不知道如何做到這一點。 –

我想你無法避免使用現有的代碼和樣式 - 但如果你擔心身體上現有的頂部邊距，只需首先檢查這個值。即。獲取身體上邊距值，添加你的元素高度，重新申請。 jQuery中的語法例（出簡單的，可以做同樣的香草的JavaScript）

$('body').css('margin-top',$('body').css('margin-top') + yourdiv-height);

來源

2013-11-21 11:15:11 rita

這將工作完美，但我不能保證jquery加載在頁面上。我怎樣才能在香草Javascript中做到這一點？我已試過，但它不工作：變種體= document.getElementsByTagName（ '主體'）[0]; body.style.marginTop = body.style.marginTop + 40; –

我已經排序 - 改爲：body.style.marginTop = body.style.marginTop + 40 +「px」;它工作很棒:) –

在頁面頂部插入div而不覆蓋使用javascript

回答

相關問題