欢迎来到361模板(www.ke361.com),原创精品织梦模板提供商。QQ快速注册登录 网站托管 VIP 网站定制

361模板网

当前位置:361模板网 > 技术文档 > 程序代码 > 响应式网站如何布局广告代码 页面不同宽度显示不同广告实现办法
这篇文章主要为大家详细介绍了响应式网站如何布局广告代码 页面不同宽度显示不同广告实现办法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,有需要的朋友可以收藏方便以后借鉴。

现在越来越多的网站都实现了响应式的效果,响应式效果能 很大成都满足不同浏览设备对网站的需求,能更好的适应更种浏览窗口的大小,但是同时也造成了我们投放广告的麻烦。

一般的广告都是固定尺寸的,如何实现我们需要不同尺寸的页面显示不同的广告呢?

下面361模板网就给大家分享实现办法,直接上代码:

window.screen.width >= 760) {
document.writeln("<div class=\'mobPostBox\'>");
document.writeln("<div class=\'mobPostTwo\'>");
document.writeln("<script type=\"text/javascript\">");
document.writeln("    /*970*90 创建于 Tue Jul 18 2017*/");
document.writeln("    var cpro_id = \"u3038186\";");
document.writeln("</script>");
document.writeln("<script type=\"text/javascript\" src=\"http://cpro.baidustatic.com/cpro/ui/c.js\"></script>");
document.writeln("");
document.writeln("</div>");
document.writeln("</div>");
window.screen.width < 760) {
document.writeln("<div class=\'mobPostBox\'>");
document.writeln("<div class=\'mobPostTwo\'>");
document.writeln("
<a rel=\"nofollow\" href=\"http://cloud.tencent.com/redirect.php?redirect=1005&cps_key=b545e06dad305da6d86247c34a6490b0\" target=\"_blank\">
<img src=\"/ads/q314x100.jpg\" border=\"0\" /></a>
");
document.writeln("</div>");
document.writeln("</div>");

这2端代码的是意思是:

当屏幕宽度显示宽度大于等于760的时候显示 百度联盟 广告

当现实宽度小于760的时候 显示 自定义的 图片广告。


以上就是响应式网站如何布局广告代码 页面不同宽度显示不同广告实现办法的全部内容,希望对大家的学习和解决疑问有所帮助,也希望大家多多支持361模板网。

感谢打赏,我们会为大家提供更多优质资源!

热词标签: 响应式网站

上一篇常用SQL命令大全

下一篇如何用CSS实现PC端显示 手机端隐藏代码效果

取消

感谢您的支持,我们会继续努力的!

扫码支持
扫码打赏,你说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

Powered by361模板网,分享从这里开始,精彩与您同在