IE6中奇怪的布局问题

发布于 09-18 15:33 字数 1817 浏览 9 评论 0原文

alt text

URL: http://www.hkpete.com/test.html

jQuery 1.42
jQuery Tools 1.2.3 覆盖

IE7也有这个问题(在ietester上测试)

我找不到问题所在。

多谢。

<div id="dialog-content">
    <!--Login -->
    <div id="login" class="panel" style="display:none">
    Login..................
    </div>
    <!--Register -->
    <div id="register" class="panel" style="display:none">
    Register..................
    </div>
</div>

<!--Links-->
<a href="javascript:;" onclick="showDialog('#login','member');">Login</a>
<a href="javascript:;" onclick="showDialog('#register','member');">Register</a>

<script type="text/javascript">
var ol;
var dialog=null;
function showDialog(panel,action){
      var each=each ? each : 0;
     function overlay(){
            if(panel){
                $("#dialog div.panel").hide();
                //show panel login,register,lostpw
                $(panel).show();
            }
            if(ol !== undefined && ol.isOpened()) {

                    $("#dialog").css("top", ( $(window).height() - $("#dialog").height() ) / 2+$(window).scrollTop() + "px"); 
                    $("#dialog").css("left", ( $(window).width() - $("#dialog").width() ) / 2+$(window).scrollLeft() + "px");
            }

            //Overlay load          
            ol=$("#dialog").overlay({top:'center', left:'center', closeOnClick:false, api:true }).load();

            $("#dialog .close").click(function(){
               ol.close();
            }); 
     }


    overlay();
    //cur action
    dialog=action;

return false;
}
</script>

alt text

URL: http://www.hkpete.com/test.html

jQuery 1.42
jQuery Tools 1.2.3 overlay

IE7 has this problem too (tested on ietester)

I can not find where the problems lie.

Thanks a lot.

<div id="dialog-content">
    <!--Login -->
    <div id="login" class="panel" style="display:none">
    Login..................
    </div>
    <!--Register -->
    <div id="register" class="panel" style="display:none">
    Register..................
    </div>
</div>

<!--Links-->
<a href="javascript:;" onclick="showDialog('#login','member');">Login</a>
<a href="javascript:;" onclick="showDialog('#register','member');">Register</a>

<script type="text/javascript">
var ol;
var dialog=null;
function showDialog(panel,action){
      var each=each ? each : 0;
     function overlay(){
            if(panel){
                $("#dialog div.panel").hide();
                //show panel login,register,lostpw
                $(panel).show();
            }
            if(ol !== undefined && ol.isOpened()) {

                    $("#dialog").css("top", ( $(window).height() - $("#dialog").height() ) / 2+$(window).scrollTop() + "px"); 
                    $("#dialog").css("left", ( $(window).width() - $("#dialog").width() ) / 2+$(window).scrollLeft() + "px");
            }

            //Overlay load          
            ol=$("#dialog").overlay({top:'center', left:'center', closeOnClick:false, api:true }).load();

            $("#dialog .close").click(function(){
               ol.close();
            }); 
     }


    overlay();
    //cur action
    dialog=action;

return false;
}
</script>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

梦亿2024-09-25 15:33:45

我想我知道这个错误是什么: http://www.positioniseverything.net/explorer /ienondisappearcontentbugPIE/index.htm

列出的解决方法是:

解决方法人们可能会“释放
以多种方式拼写“:

  1. 暂时将内容的显示属性切换为
    “阻止”然后返回“无”。
  2. 暂时切换内容的位置属性
    “相对”到“绝对”然后返回,或者
    反之亦然。
  3. 暂时将内容的可见性属性切换为
    “隐藏”并返回。 (但这仅
    如果内容是则有效
    定位绝对!精彩的
    IE 世界...)

去那里看看以获取更多信息。

I think I know what this bug is: http://www.positioniseverything.net/explorer/ienondisappearcontentbugPIE/index.htm.

The workarounds listed are:

Work arounds One may 'release the
spell' in a number of ways:

  1. temporarily switch the content's display property to
    'block' and back to 'none'.
  2. temporarily switch the content's position property from
    'relative' to 'absolute' and back, or
    vice versa.
  3. temporarily switch the content's visibility property to
    'hidden' and back. (But this only
    works if the content is
    positioned absolutely! The wonderful
    world of IE...)

Go and have a look there for more information.

_蜘蛛2024-09-25 15:33:45

谢谢,蒋毅。
错误演示 http://www.justarrangingbits.org/demo/2/

 //fix the bug
 if(panel){ 
           $("#dialog .panel").css({"display":"none","visibility":"hidden"});
           $(panel).css({"display":"block","visibility":"visible"});
 } 

thanks ,Yi Jiang.
the bug demo http://www.justarrangingbits.org/demo/2/

 //fix the bug
 if(panel){ 
           $("#dialog .panel").css({"display":"none","visibility":"hidden"});
           $(panel).css({"display":"block","visibility":"visible"});
 } 
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文