网站目录

我爱导航

JS实现响应式模板广告切换,电脑和手机显示不同

  JS实现响应式模板广告切换,电脑和手机访问显示不同广告,随着html5网页技术的日益发展,越来越多的网站都喜欢做成PC和WAP同源码的响应式模板,这样的模板有非常大的优势,代码不紧凑无需多终端多代码,同一段代码可以适应全部终端,但是同时也带来了一些小的问题,例如如果想投放一段广告,该广告只想在PC端显示而WAP端不显示,或者只想WAP端显示PC端不显示该如何处理呢?今天我爱导航给大家带来JS实现响应式模板广告布局,电脑和手机访问显示不同广告内容代码。HUC网站目录_网站分类目录_我爱导航网


  1. HUC网站目录_网站分类目录_我爱导航网

    <script>HUC网站目录_网站分类目录_我爱导航网

  2. var url = location.search;HUC网站目录_网站分类目录_我爱导航网

  3. url = url.substr(1);HUC网站目录_网站分类目录_我爱导航网

  4. var bs={HUC网站目录_网站分类目录_我爱导航网

  5. versions:function(){HUC网站目录_网站分类目录_我爱导航网

  6. var u = navigator.userAgent, app = navigator.appVersion;HUC网站目录_网站分类目录_我爱导航网

  7. return {HUC网站目录_网站分类目录_我爱导航网

  8. trident: u.indexOf('Trident') > -1, HUC网站目录_网站分类目录_我爱导航网

  9. presto: u.indexOf('Presto') > -1,HUC网站目录_网站分类目录_我爱导航网

  10. webKit: u.indexOf('AppleWebKit') > -1, HUC网站目录_网站分类目录_我爱导航网

  11. gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, HUC网站目录_网站分类目录_我爱导航网

  12. mobile: !!u.match(/AppleWebKit.*Mobile.*/)||!!u.match(/AppleWebKit/), HUC网站目录_网站分类目录_我爱导航网

  13. ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), HUC网站目录_网站分类目录_我爱导航网

  14. android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, HUC网站目录_网站分类目录_我爱导航网

  15. iPhone: u.indexOf('iPhone') > -1,HUC网站目录_网站分类目录_我爱导航网

  16. iPad: u.indexOf('iPad') > -1 HUC网站目录_网站分类目录_我爱导航网

  17. };HUC网站目录_网站分类目录_我爱导航网

  18. }(),HUC网站目录_网站分类目录_我爱导航网

  19. language:(navigator.browserLanguage || navigator.language).toLowerCase()HUC网站目录_网站分类目录_我爱导航网

  20. } HUC网站目录_网站分类目录_我爱导航网

  21. var flag = true;HUC网站目录_网站分类目录_我爱导航网

  22. if(bs.versions.mobile && url!='mobile'){HUC网站目录_网站分类目录_我爱导航网

  23. if(bs.versions.android||bs.versions.iPhone||bs.versions.iPad||bs.versions.ios){HUC网站目录_网站分类目录_我爱导航网

  24. flag=false;HUC网站目录_网站分类目录_我爱导航网

  25. }HUC网站目录_网站分类目录_我爱导航网

  26. }HUC网站目录_网站分类目录_我爱导航网

  27. if(flag){HUC网站目录_网站分类目录_我爱导航网

  28. /*pc广告代码*/HUC网站目录_网站分类目录_我爱导航网

  29. document.writeln("<script src=\"\/js\/pc广告代码.js\"><\/script>");HUC网站目录_网站分类目录_我爱导航网

  30. }else{HUC网站目录_网站分类目录_我爱导航网

  31. /*移动广告代码*/HUC网站目录_网站分类目录_我爱导航网

  32. document.writeln("<script language=JavaScript src=\"\/移动广告代码.js\"><\/script>");HUC网站目录_网站分类目录_我爱导航网

  33. }HUC网站目录_网站分类目录_我爱导航网

  34. </script>

    HUC网站目录_网站分类目录_我爱导航网

    HUC网站目录_网站分类目录_我爱导航网



    HUC网站目录_网站分类目录_我爱导航网

上面的代码我们首先把PC广告代码放到js里,移动端广告代码放到js中,这样就可以实现不同终端出现不同的广告了。以上就是JS实现响应式模板广告布局,电脑和手机访问显示不同广告内容代码的全部内容,希望对大家的学习和解决疑问有所帮助,也希望大家多多支持我爱导航网。HUC网站目录_网站分类目录_我爱导航网

文章来自:我爱导航,未经允许不得转载!:我爱导航 > 教程收藏 > 建站经验 » JS实现响应式模板广告切换,电脑和手机显示不同

JS广告切换 ( )

相关推荐