【範例】教你實現「帶關閉鈕置底浮動Google廣告」,使用css+javascript

最近想試試看置底比較不會遮到畫面的廣告,網路上查了不少範例,有用css/jquery各種寫法,找到了一種較簡單的片段,也更容易移植到所有文章。 根據Google Ads的規範,似乎都不允許遮畫面影響瀏覽體驗的浮動廣告了,因此使用這種做法是有被Google Ads檔掉的可能性唷,請慎用。 整合步驟目錄 浮動視窗程式碼片段 挑選Google Ads script 蓋版廣告注意事項 . 1 浮動視窗程式碼片段 程式碼片段相當簡單,只利用到了標準css固定位置的技巧,加上排版給一個關閉的按鈕。 <!-- 靠右下範例 --> <div id="left_bottom_AD" style=" position:fixed; bottom:50px; right:0px;z-index: 99999999999; "> <table border="0" cellpadding="0" cellspacing="1"> <tr><td style="text-align: right;"> <a href="javascript:;" onclick="javascript:document.getElementById('left_bottom_AD').style.display='none';">關閉</a> </td></tr> <tr><td> <!-- Google 廣告保留區段 --> </td></tr> </table> </div> position:fixed; → 用途為固定位置 bottom:50px; → 用途為靠底部往上50px高的位置,若要置頂可以改為top:0px,置底為bottom:0px;...