A-A+

一行代码实现了侧边栏悬停效果的广告

2014年03月19日 建站之旅

话说前些天三好公民摆弄的那个“Q2W3 Fixed Widget”插件,原本的目的也是为了能在侧边栏投放悬停效果的广告。无奈后来偶然发现使用“Q2W3 Fixed Widget”插件后在IE8浏览器下竟然网页崩溃无法显示,只好弃用了该插件,广告也恢复成了原来的固定的样式。

但总觉得不甘心,于是今天又在网上搜索了一下,竟然发现原来2013年7月份百度就已经推出悬停广告的模式了,只怪自己疏于关注这方面的资讯,竟然现在才看到。而百度提供的这个方法真是极其简单,最初是在广告代码中插入一行代码即可实现,后期百度干脆直接在代码效果中增加了“增加悬停效果”的选项。

无奈提供“增加悬停效果”的选项的代码位尺寸只有“矩形”336*280、330*250或“其它”360*300、250*250、200*200,而三好公民想要实现悬停效果的代码位是160*600,所以就选择了自动添加代码的方法。下面举例说明:

假如你的某个广告代码位的原始代码为:

1
2
3
4
5
<script type="text/javascript">
/* xxx*xxx,创建于20xx-x-xx */
varcpro_id = "uxxxxxx";
</script>
<script src=http://cpro.baidustatic.com/cpro/ui/c.js" type="text/javascript"></script>

那么你只需要在其中插入如下代码:

1
2
3
(window["cproStyleApi"] = window["cproStyleApi"] || {})[cpro_id] = {
 xuanting: 1
};

插入之后原始代码就变成了如下内容:

1
2
3
4
5
6
7
8
<script type="text/javascript">
/* xxx*xxx,创建于20xx-x-xx */
varcpro_id = "uxxxxxx";
(window["cproStyleApi"] = window["cproStyleApi"] || {})[cpro_id] = {
 xuanting: 1
};
</script>
<script src=http://cpro.baidustatic.com/cpro/ui/c.js" type="text/javascript"></script>

然后你把修改后的广告代码添加到网页的合适位置就可以了,效果可以预览一下本博客侧边栏的百度悬停广告。

微信扫码
支付宝扫码
请打赏,这是对本文作者最实在的帮助和鼓励!