网站目录

                                    网站目录

                                    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实现响应式模板广告布局,电脑和手机访问显示不同广告内容代码的全部内容,希望对大家的学习和解决疑问有所帮助,也希望大家多多支持好好目录网。

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

                                    JS广告切换 ( )

                                    相关推荐