<!
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
>
< html xmlns ="http://www.w3.org/1999/xhtml" >
< head >
< meta http-equiv ="Content-Type" content ="text/html; charset=ISO-8859-1" >
< title > Insert title here </ title >
< style >
#indicator {
position : absolute ; left : 0px ; top : 0px ;
}
body>div#indicator {
position : fixed ;
}
#indicator {
background-color : yellow ;
color : red ;
padding : 2px 2px 2px 2px ;
left : expression( (johndoe2 = document.documentElement.scrollLeft ?
document.documentElement.scrollLeft : document.body.scrollLeft ) + 'px' ) ;
top : expression( (johndoe1 = document.documentElement.scrollTop ?
document.documentElement.scrollTop : document.body.scrollTop ) + 'px' ) ;
}
</ style >
</ head >
< body >
< div id ="indicator" >
< span > loading
</
span
>
</ div >
</ body >
</ html
< html xmlns ="http://www.w3.org/1999/xhtml" >
< head >
< meta http-equiv ="Content-Type" content ="text/html; charset=ISO-8859-1" >
< title > Insert title here </ title >
< style >
#indicator {
position : absolute ; left : 0px ; top : 0px ;
}
body>div#indicator {
position : fixed ;
}
#indicator {
background-color : yellow ;
color : red ;
padding : 2px 2px 2px 2px ;
left : expression( (johndoe2 = document.documentElement.scrollLeft ?
document.documentElement.scrollLeft : document.body.scrollLeft ) + 'px' ) ;
top : expression( (johndoe1 = document.documentElement.scrollTop ?
document.documentElement.scrollTop : document.body.scrollTop ) + 'px' ) ;
}
</ style >
</ head >
< body >
< div id ="indicator" >
< span > loading

</ div >
</ body >
</ html
世界如果没有IE该多美好啊...
最近想在过去的程序里加些AJAX的东西,为了让界面更友好,加上一个gmail那样的提示条固定在当前可视页面的左上角。可惜的IE 7以下的版本并不支持 position:fixed属性导致不得不用css hack的方式实现,google了以下找到一个不用js相对洁净的实现。
实现的方式:
1.用子对象选择符隔离IE 5,6
2.用expression来计算位置,此时又做了一次hack,因为如果不赋值给一个变量(johndoe1,johndoe2),expression在IE里面仍然得不到正确的值...