最近感觉很忙,又有点闲时间来更新博客。折腾着折腾着发现一个小问题:在主题制作或者修改中一些元素要设置为随页面滚动的效果,通常的做法是加上fixed属性,或者干脆用js实现这个功能。
不过对于懒得去后台更新js文件的同学来说,这不是个好办法,或者对于还未引入js的同学,这更不是好办法。但是不用的话在IE6下会无效,这个经典到目前访问量的半数以上的浏览器版本是直接无视fixed的(当然还有其他若干问题,所以希望更新或扔掉该浏览器)。
关于这个问题的解决办法,我之前的做法一直是用_position:absolute来暂时修订,当然这么做产生的效果和想象中的差距很大。最近发现一个方法来修正IE6的fixed效果,如下:
_top:expression(documentElement.scrollTop + 数值 + "px")
也是一个简单的hack,对于不想引入JS又迫切希望使用fixed属性的人来说,确实是个好办法。
More:
Q:有时候好像使用document.body.scrollTop来获取滚动条滚动的长度,结果滚动后得到的也是0,为什么改用document.documentElement.scrollTop就可以了?
A:可以查看一下源代码,如果没有
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
这一句那么可以用document.body.scrollTop,否则只能用document.documentElement.scrollTop。
原因:在标准w3c下,document.body.scrollTop恒为0,需要用document.documentElement.scrollTop来代替;document.documentElement.scrollTop中documentElement 对应的是 html 标签;document.body.scrollTop 中 body 对应的是 body 标签。
我正好要用到耶,不错不错
@万戈 我测试完没啥问题~就是IE6下的位置还要再重新定~万哥加油折腾!
@阿修 刚才留言comments-ajax.php有报错,再来测试一下
@阿修 果然还有错。。。
@万戈 被你发现了,我在改主题……
@阿修 再回个试试
一向都无视哀翼流啊
@Mucid 我也想无视它,可是看看访问者,一般多都是IE6……win7快快普及吧
@阿修
Linux快点普及吧
@Mucid 那估计有点难度,毕竟不是每个人都热爱命令的
我的主题就是用了大量的fixed的元素,就是用的你说的这个方法。
还要区分顶部固定和底部固定,不过还是没调整好
@winy 多试试就可以了,我这个顶部栏也测试了好几次。IE6下元素是从当前位置开始算的,而不是整个页面~~放的位置会很郁闷……
@阿修 我是左侧,顶部,右侧和底部统统都用fixed,那叫一个麻烦
@winy 我晕啊,听着就很棘手,你继续加油吧~~铁杵磨成针
顶部的这个导航很好用,拿走
@winy 哈哈,拿走吧~
ie6 好久都没用了 不过学习了
@zzzhu 但是访问者会使用啊~~
最近忙期末考试 好久没有串门了~
过来转转
顺便点下ad~
@ikeeptrying 谢谢,点点更健康~~
fixed会影响平滑滚动的流畅度。。我用userjs消灭了fixed。。
一切为了流畅
@A.shun 我好像没什么感觉……至少chrome挺流畅的。
@阿修 那你是没用过 平滑滚动
Opera 特有功能,FF和chrome需要额外的扩展实现
@A.shun 不是很喜欢opera的平滑滚动效果
方法很不错
我现在已经决定放弃IE6了
@园子 希望更多人放弃才好哈~~
额,看不懂,不发表意见~
@草儿 纯水打PP~~
IE6要被消灭了吧
@先看看 微软都给他判死刑了,但是国内还没办法~~
微软都放弃IE6了,可偏偏国内的装机商/浏览器套壳者还不放弃,唉!
@lifishake XP不灭,IE6不死
@阿修 至少我是XP + ie8,虽然不怎么用ie,也有些网站没它不行
@流年 比如某些网上银行之类的……
@阿修 嗯嗯
好办法..嗯.好办法.不过话说我好久没用IE了。。
@虾 虾是好同学哈,我也不用IE~
黑色背景配广告位很好看 哈哈哈~~来水一下~
@宋夏 水吧水吧我不怕。黑色确实耐看
还没用,感觉主要是现在还用不上,可以保存在文档里 等有的时候就能找到了。
@7cbt 以后会用到的。
好久没有用IE6了,现在在 win7 的ie8下
@ppg 支持win7的普及!
暂时还没有用过这个样式~
@集趣 呵呵,说不定哪天就用到啦……
ie6就让它去吧
@zwwooooo 部分人都这么想的,但是国内还是有困难……
嘿嘿 这招很管用
@卢松松 管用就好!~
我还是乖乖的用我的IE8
@博百优 不是IE6就行啦
技术文啊..看到我一头雾水了..嘿嘿
@创享·生活 算不上技术文,就是瞎折腾~~
明天断网,赶来一踩。
@Kada 莫非要开始闭关修炼?加油!
@阿修 ,主要原因是,没有网费了,不过也好!
@Kada 对,没有网络更能专心研究了
我的主题在IE6下也是错位的。不会改、
@Junan 多练练就会改了。目前我的主题在IE6下还不算很杯具
@阿修 有空要来请教一下博主先,
@Junan 呵呵,能解决一定鼎力相助~~
添一块砖~~~~、
@金山识别码
谢谢
无视ie6~~~
@小羿 我也想无视,不过后来觉得稍微照顾一下它吧~岁数那么大了
这次的皮肤有点味道,CSS3用的也不错啊,年轻真好!~
@YoungCheon
太棒啦,终于得到正面评价了,很高兴。你也很年轻呢~
离开IE6已经很久了,看你的banner,居然是一个阿根廷球迷 哈哈!
@苏扬 终于有人发现啦,我确实很喜欢阿根廷啊!~~
阿修,貌似那天我说的滚动条就按照你这个方法解决袄?我在这里看见滚动条啦
@指舞六弦 莫非真是的?
有没有复杂的方法让自行车支持 V12 涡轮增压发动机啊?
@拆墙部队
现在IE6的人应该不多了。
@混生 呵呵,去网吧看看就知道啦。
啊悲剧的巴西,回家了哦
有时候我也想直接抛弃ie6,不管,但是好多用户仍然是使用的ie6,特别是那些单位学校。不得不考虑啊
@学夫子 这也是本篇写出来的原因了
没太明白,有时间了帮我看个主题,我想改点小东西……
@天天天蓝 好,有时间发给我就行了。
@阿修 本来想了解下Theme-junkie的,后来就算了,很不错的,你可以看看
iE6缺点不是一般的多,现在都直接用火狐了!
@追忆永恒 希望更多人放弃IE6
用的人是挺多的.经常用到的PNG也要用JS来实现.
@可乐 唉,都是IE6惹的祸。
正好前两天遇到这个问题,膜拜阿修
@小雯子 膜拜我干啥,哈哈
@夏影残雪 哈哈,屏蔽是好办法
@隐残影 哈哈,被你发现了~~
很强大 学习了!~