当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > 不用js多浏览器兼容纯DIV/CSS对联漂浮广告代码

CSS样式表
正确地利用css改进网站设计的3个技巧
CSS网页设计 把HTML标记分类
几个Reset CSS的八卦问题
css 网页虚线制作方法剖析
网页制作小技巧 dl dt dd标签用法
玩转CSS3色彩
RGBa色彩的浏览器支持分析
WEB标准心得之网页重构的思路
学习web标准的十个重要理由总结
CSS 星级评价效果代码
ie6 fixed bug的解决方法 (css+js)
html pre标签使文本自动换行
CSS word-wrap同word-break的区别
css 入门基础教程
IE7或者IE8全屏解决方案
JavaScript CSS Style属性对照表
优秀设计和卓越设计之间的细微区别
CSS教程:容易忽略的但是很熟悉的CSS属性
通过语义化的标签减少DIV简化网页代码
html和css实现数据图表的展示效果

CSS样式表 中的 不用js多浏览器兼容纯DIV/CSS对联漂浮广告代码


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-12   浏览: 299 ::
收藏到网摘: n/a

两侧漂浮。经测试,兼容IE6,IE7,Firefox浏览器 纯DIV/CSS对联漂浮广告代码(无JS)
源码网两侧漂浮。经测试,兼容IE6,IE7,Firefox浏览器。
CSS代码为:
复制代码 代码如下:

.r1{width:80px;height:80px;background:red;float:right;
position:fixed !important; top/**/:200px;
position:absolute; z-index:300; top:expression(offsetParent.scrollTop+200);right:20px;}
.r2{width:80px;height:80px;background:red;float:right;
position:fixed !important; top/**/:300px;
position:absolute; z-index:400; top:expression(offsetParent.scrollTop+300);right:20px;}
.l1{width:80px;height:80px;background:red;float:right;
position:fixed !important; top/**/:200px;
position:absolute; z-index:300; top:expression(offsetParent.scrollTop+200);left:20px;}
.l2{width:80px;height:80px;background:red;float:right;
position:fixed !important; top/**/:300px;
position:absolute; z-index:400; top:expression(offsetParent.scrollTop+300);left:20px;}

页面代码为:
复制代码 代码如下:

<div class="r1"><a href="http://www.ruanchen.com" target='_about'><img src="/js/pic/piao-l-1.gif" width="80" height="80" border="0" /></a></div>
<div class="r2"><a href="http://www.ruanchen.com" target='_about'><img src="/js/pic/piao-l-1.gif" width="80" height="80" border="0" /></a></div>
<div class="l1"><a href="http://www.ruanchen.com" target='_about'><img src="/js/pic/piao-l-1.gif" width="80" height="80" border="0" /></a></div>
<div class="l2"><a href="http://www.ruanchen.com" target='_about'><img src="/js/pic/piao-l-1.gif" width="80" height="80" border="0" /></a></div>