如何讓橫幅關閉功能在此前的答案中工作？

Question

大衛托馬斯先前回答了關於超級強制橫幅的問題，默認情況下在訪問者查看主頁內容之前查看橫幅。

Superimpose a banner div over another div, with jQuery if possible

我已經是盡我所能編碼和它的作品到一個點，但也有幾個問題，完全歸功於我敢肯定，我等事項的低層次的知識！ 1）X關閉不起作用，但它不會因爲我還沒有把JSQuery的編碼部分放到任何地方 - 它到底在哪裏 - 是否有JS的單獨文件（在這種情況下你如何在HTML中引用它？），還是在CSS等標題？對不起，這個愚蠢的問題

2）我的橫幅高度只有250px，但下面的內容長了好幾段 - 內容已被橫幅隱藏起來（有白色背景，因爲橫幅本身就是我選擇的白色），但頁腳位於頁面底部，位於內容結尾處，因此存在很大差距，看起來有點廢話。我可以讓頁面只顯示橫幅的實際高度，然後當它關閉時，頁面會延伸到顯示內容的樣子？非技術術語我知道，但不知道如何解釋...

3）我的橫幅沒有覆蓋整個內容的寬度，所以我可以居中它，而不是把它放在0,0？

非常感謝 克萊爾

Answer 1

問題1：您可以複製的jQuery代碼在一個單獨的文件，例如所謂main.js，並將其包含在你的HTML頁面的頭部與

<script src="main.js"></script> 

的情況下，該文件將是下一個到你的HTML頁面。更好的做法是對css，腳本和圖像使用單獨的文件夾，例如如果你有一個目錄名爲scripts的包括將

<script src="/scripts/main.js"></script> 

爲相對路徑（假設你的HTML網頁的根目錄下的腳本作爲子目錄），或者，萬一你沒有本地測試本地服務器

<script src="scripts/main.js"></script> 

一定要包括在你的jQuery 的版本，包括使用jQuery功能的JavaScript文件。
您還可以將腳本部分包含在html頁面中（也包括在jquery之後）作爲內聯腳本：<script> /* your code */ </script>。爲了完整性 - 因爲我不知道所討論的html（如果它是HTML5或HTML4） - 可能需要將type屬性添加到script標記：<script type="text/javascript">這也適用於包含js文件的腳本標記關於在線腳本的腳本標記。 type屬性在HTML5中是可選的，但在HTML4中是必需的。

同樣爲了完整性：您也可以考慮在關閉body標記之前包含腳本，而不是放在頭部分中 - 詳細解釋爲什麼將CSS包含在標題中並且可以在此處找到js ：Where to place Javascript in a HTML file?

有關內聯腳本與內聯腳本的進一步參考與外部腳本文件：When should I use Inline vs. External Javascript?

問題2：否。已經有javascript函數resizeTo() - 被稱爲像例如。 window.resizeTo(400,400) - 這可以調整瀏覽器窗口的大小，但出於很好的原因，默認情況下，許多瀏覽器都已禁用此功能。參考例如這裏：The javascript "resizeTo" function not working in Chrome and Opera和這裏：http://kb.mozillazine.org/Resizing_oversize_window#JavaScript_no_longer_allowed_to_resize_windows__through_the_Location_Bar。您可以使用例如一個面具，而不是 - 你可能已經看過很多頁面，例如當模式窗口中顯示圖像/幻燈片/視頻等時，模態窗口下方的頁面將覆蓋灰色透明格。例如一個非常簡化的Fiddle。當您點擊橫幅時，橫幅以及面具將被隱藏。

$(document).ready(function() { 
    $("#banner").on("click", function() { 
    $("#banner, #mask").hide(); 
    }); 
    $('#mask').height($(document).height()); 
}); 

參考：當小提琴被加載並且可以使用包裹在$(document).ready(function() {}當jquery的加載來設置掩模，以原稿的高度的高度要執行已執行在小提琴jQuery代碼因爲這只是一種可能的方法來設置面膜覆蓋屏幕（在像面具的寬度設置爲100％的小提琴附加CSS），您可以在這裏檢查的幾種方法：How to make a div 100% of page (not screen) height?

問題3：在上面的小提琴中使用了幾種解決方案之一來顯示div居中。您可以查看這裏提供的各種解決方案：Using jQuery to center a DIV on the screen