日期:2014-05-16  浏览次数:20445 次

jquery 解决ie6.0 position:fixed bug
HTML code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js" type="text/javascript"></script>
<title>IE6 position:fixed bug</title>
<style> 
    #floatDiv{width:150px; height:50px; background:green;} 
</style>
<script type="text/javascript">
$(function(){
    if($.browser.msie && $.browser.version=="6.0"){
        var div1 = "<div style='position:absolute; right:10px; top:expression(documentElement.scrollTop+documentElement.clientHeight-this.offsetHeight-10)'></div>";
        $("#floatDiv").wrap(div1);
    }
})
</script>
</head>
<body>
    <div id="floatDiv"></div>
    
    <p style="height:1500px;"></p>
</body>
</html>





以上代码,IE6.0老报错(IETester测试),我应该怎样 将一个 对象 包含在

<div style="position:absolute; right:10px; top:expression(documentElement.scrollTop+documentElement.clientHeight-this.offsetHeight-10)"></div>

标签内,如下:
HTML code

<div style='position:absolute; right:10px; top:expression(documentElement.scrollTop+documentElement.clientHeight-this.offsetHeight-10)'>
    <div id="floatDiv"></div>
</div>






------解决方案--------------------
表达式 不能写在行内样式中吧。

HTML code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <script src="http://code.jquery.com/jquery-latest.js"></script>
<title>IE6 position:fixed bug</title>
<style> 
    #floatDiv{width:150px; height:50px; background:green;} 
    
    .test {
        top:expression(documentElement.scrollTop+documentElement.clientHeight-this.offsetHeight-10)
    }
    
</style>
<script type="text/javascript">
$(function(){
    if($.browser.msie && $.browser.version=="6.0"){
        var div1 = "<div style='position:absolute; right:10px; ' class='test'></div>";
        $("#floatDiv").wrap(div1);
    }
})
</script>
</head>
<body>
    <div id="floatDiv"></div>
    
    <p style="height:1500px;"></p>
</body>
</html>

------解决方案--------------------
注意quirks文档