• <td id="ywaww"></td>
  • 網站目錄

    網站目錄

    JS實現響應式模板廣告切換,電腦和手機顯示不同

      JS實現響應式模板廣告切換,電腦和手機訪問顯示不同廣告,隨著html5網頁技術的日益發展,越來越多的網站都喜歡做成PC和WAP同源碼的響應式模板,這樣的模板有非常大的優勢,代碼不緊湊無需多終端多代碼,同一段代碼可以適應全部終端,但是同時也帶來了一些小的問題,例如如果想投放一段廣告,該廣告只想在PC端顯示而WAP端不顯示,或者只想WAP端顯示PC端不顯示該如何處理呢?今天好好目錄給大家帶來JS實現響應式模板廣告布局,電腦和手機訪問顯示不同廣告內容代碼。


    1. <script>

    2. var url = location.search;

    3. url = url.substr(1);

    4. var bs={

    5. versions:function(){

    6. var u = navigator.userAgent, app = navigator.appVersion;

    7. return {

    8. trident: u.indexOf('Trident') > -1,

    9. presto: u.indexOf('Presto') > -1,

    10. webKit: u.indexOf('AppleWebKit') > -1,

    11. gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1,

    12. mobile: !!u.match(/AppleWebKit.*Mobile.*/)||!!u.match(/AppleWebKit/),

    13. ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/),

    14. android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1,

    15. iPhone: u.indexOf('iPhone') > -1,

    16. iPad: u.indexOf('iPad') > -1

    17. };

    18. }(),

    19. language:(navigator.browserLanguage || navigator.language).toLowerCase()

    20. }

    21. var flag = true;

    22. if(bs.versions.mobile && url!='mobile'){

    23. if(bs.versions.android||bs.versions.iPhone||bs.versions.iPad||bs.versions.ios){

    24. flag=false;

    25. }

    26. }

    27. if(flag){

    28. /*pc廣告代碼*/

    29. document.writeln("<script src=\"\/js\/pc廣告代碼.js\"><\/script>");

    30. }else{

    31. /*移動廣告代碼*/

    32. document.writeln("<script language=JavaScript src=\"\/移動廣告代碼.js\"><\/script>");

    33. }

    34. </script>



    上面的代碼我們首先把PC廣告代碼放到js里,移動端廣告代碼放到js中,這樣就可以實現不同終端出現不同的廣告了。以上就是JS實現響應式模板廣告布局,電腦和手機訪問顯示不同廣告內容代碼的全部內容,希望對大家的學習和解決疑問有所幫助,也希望大家多多支持好好目錄網。

    文章來自:網站目錄,未經允許不得轉載?。?a href="http://www.youthfulsolutions.net/">我愛導航 > 教程收藏 > 建站經驗 » JS實現響應式模板廣告切換,電腦和手機顯示不同

    JS廣告切換 ( )

    相關推薦