请选择 进入手机版 | 继续访问电脑版
快捷导航
 
广告只在移动端显示,电脑端显示另外一种广告的方法教程
VIEW CONTENTS
jiaxan秀 首页 综合新闻 查看内容

广告只在移动端显示,电脑端显示另外一种广告的方法教程

2020-10-26 13:16| 发布者: 钱来也理财| 查看: 91| 评论: 0
摘要: 随着时间推移,移动流量剧增,很多网站的广告都是移动端广告,但是这些广告也会在PC端显示,下面就为大家分享两种广告只在移动端显示的方法。一种是js的,一种是利用css的display:none控制。如何放入手机和电脑端显 ...
随着时间推移,移动流量剧增,很多网站的广告都是移动端广告,但是这些广告也会在PC端显示,下面就为大家分享两种广告只在移动端显示的方法。
一种是js的,一种是利用css的display:none控制。
如何放入手机和电脑端显示不同的广告代码,有二种方法。
这里完美来分享一下教程吧:

第一种:

<script>

var url = location.search;

url = url.substr(1);

var bs={

versions:function(){

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

return {

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

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

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

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

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

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

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

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

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

};

}(),

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


var flag = true;

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

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

flag=false;

}

}

if(flag){

/*940*90电影网广告位*/

var cpro_id = "u3191574";  

document.write("<script src='//cpro.baidustatic.com/cpro/ui/c.js' type='text/javascript'></sc"+"ript>");

}else{

/*20:6 信息流 2018/6/22*/

var cpro_id = "u3466360";

document.write("<script src='//cpro.baidustatic.com/cpro/ui/cm.js' type='text/javascript'></sc"+"ript>");

}

</script>

第二种:

<style type="text/css">

.pc_acmsd{display:block;}

.m_acmsd{ display:none}

@media(max-width:768px) {

.pc_acmsd{display:none !important;}

.m_acmsd{display:block !important;}}

</style>

<div class="pc_acmsd">此处放入显示在电脑上的广告代码</div>

<div class="m_acmsd">此处放入显示在手机上的广告代码</div>

上面CSS的意思:

display:block  这是显示的意思

display:none 这是隐藏的意思

@media(max-width:768px)  判断页面宽度小于768PX的时候显示后面{ }的样式。

pc版效果:

手机版效果:


鲜花

握手

雷人

路过

鸡蛋

最新评论

让创业更简单

  • 反馈建议:service_media@QQ.com
  • 客服电话:40000000001
  • 工作时间:周一到周五

云服务支持

服务支持 快云 服务支持

精彩文章,快速检索

关注我们

  • 联系我们