覽網站的時候,有些網站總是在右下角,左上角或者其他地方投放廣告。
我用jQuery試著自己做了一個,代碼如下,如有不對的地方請各位不吝賜教
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>  <title></title>  <script src="jquery-1.8.3.js"></script>  <script type="text/javascript">    $(function () {      $('#btn').click(function () {        //創建層        var divObj = $('<div style="width:200px;height:200px;position:absolute;right:0;bottom:0;background-color:orange"></div>').appendTo($('body'));        //創建右上角關閉按鈕        $('<sapn style="float:right;cursor:pointer; border:3px solid gray">X</span>').click(function () {          $(this).parent().remove();        }).appendTo($(divObj));        //添加廣告內容      });    });  </script></head><body>  <input type="button" name="name" value="顯示效果" id="btn"/></body></html>效果圖如下所示:

關于這個效果,我有以下思索:
1.可以添加一個計時器,倒計時‘還有5S關閉',還有‘4S關閉',告訴用戶這個廣告只是臨時投放,5S后自動關閉,這個可以增強用戶的體驗度,我們都知道瀏覽一些網站的時候,廣告老是占著地方在你們眼前晃悠,用戶體驗肯定不是很好,這可以很好的在廣告客戶和用戶體驗兩者之間進行一個平衡;
2.背景顏色之所以選擇orange,是因為orange是暖色,個人體驗,如果廣告背景是暖色的話,更愿意讓他停留一些時間,相對比背景色是冷色的廣告;
3.當然這只是一個小代碼,大神們把內容完成以后,可以進行封裝,使用起來肯定會更加方便。
以上這篇使用jQuery實現動態添加小廣告就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持武林網。
新聞熱點
疑難解答