【Javascript】跨浏览器兼容的浮动图片广告

    本来觉得网页上飘着图片广告是件很挫的事,结果这两天遇到有这样的需求的,个么就来search一下。代码如下:



    提示:你可以先修改部分代码再运行。

    直接保存成ad.html,在firefox和ie下看都没问题。但放到自己的网页里发现不对了,FF下出不来结果。发现是网页前加了doctype造成的,修改了两处:

    1. Firefox中DOM对象需要用document.getElementById()来获得
    2. Firefox中element.style.left属性所赋予的值需要带"px"

    改完后发现图片浮动是根据网页实际高度来的,不太合理,改为按浏览器窗口来浮动,将document.body.clientHeight改为document.documentElement.clientHeight,width对应修改。更多clientHeight的介绍可参阅《clientHeight、offsetHeight、scrollHeight对比测试分析》。

    修改完毕,拿IE6/IE7/IE8/Firefox/Opera/Chrome/Safari来测试一下,都没问题。

    修改后的代码

    提示:你可以先修改部分代码再运行。

    [完毕]



    本博客所有文章如无特别注明均为原创。
    复制或转载请以超链接形式注明转自枫芸志,原文地址《【Javascript】跨浏览器兼容的浮动图片广告
    标签:
    分享:

已经有1 条评论抢在你前面了~

  1. 沙发
    裔天 2011年3月11日 下午5:09

    非常谢谢,很好使呵呵。

    [回复]

无觅相关文章插件,快速提升流量