artDialog open IE6 兼容问题解决

artDialog 是一款超好用的弹出层插件!下载地址

在开发的过程中使用 art.dialog.open("",{});时发现在IE6中无法弹出新页面的内容

出错代码:

复制代码
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Demo.aspx.cs" Inherits="Demo" %>

<!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 runat="server">
    <title></title>

    <script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>
    <script src="js/jquery.artDialog.source.js?skin=black" type="text/javascript"></script>
    <script src="js/iframeTools.js" type="text/javascript"></script>    
    <script src="js/DD_belatedPNG_0.0.8a-min.js" type="text/javascript"></script>
    
    <script type="text/javascript">
        function ShowFocusRoom() {
            art.dialog.open('Demo2.aspx', {
                width: '100%',
                height: '100%',
                top: '0px',
                title: '测试页面'
            }, false);
        }

        function ShowHtml() {
            art.dialog.open('demo.htm', {
                width: '100%',
                height: '100%',
                top: '0px',
                title: '静态页面'
            }, false);
        }        
    </script>
    
    <!–[if IE 6]>
    <script>
        DD_belatedPNG.fix('.big .item a img,.big .item a:hover');
    </script>  
    
    <link href="css/css.css" rel="stylesheet" type="text/css" />  
    
</head>
<body>
    <form id="form1" runat="server">
        <div class="big">        
            <div class="item"><a href="javascript:;" onclick="ShowFocusRoom()"><img src="images/2.png" /></a></div>
            <div class="item"><a href="javascript:;" onclick="ShowFocusRoom()"><img src="images/3.png" /></a></div>
            <div class="item"><a href="javascript:;" onclick="ShowHtml()"><img src="images/4.png" /></a></div>
            <div class="item"><a href="javascript:;" onclick="ShowHtml()"><img src="images/5.png" /></a></div>
            <div style=" clear:both;"></div>
        </div>
    </form>
</body>
</html>
复制代码

上面的代码在Chrome 中执行完全没有问题,很漂亮。但是再到 IE6(系统环境:win2003 IE6) 上运行是,弹出层的页面一直停在 loading 状态!

原来错在:

<a href="javascript:;" onclick="ShowFocusRoom()"><img src="images/2.png" /></a> 的 A 标签上的 href="javascript:;" 上;

修改后的代码:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Demo.aspx.cs" Inherits="Demo" %>
 
<!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 runat="server">
    <title></title>
 
    <script src="js/jquery-1.7.2.min.js" type="text/javascript"></script>
    <script src="js/jquery.artDialog.source.js?skin=black" type="text/javascript"></script>
    <script src="js/iframeTools.js" type="text/javascript"></script>   
    <script src="js/DD_belatedPNG_0.0.8a-min.js" type="text/javascript"></script>
     
    <script type="text/javascript">
        function ShowFocusRoom() {
            art.dialog.open('Demo2.aspx', {
                width: '100%',
                height: '100%',
                top: '0px',
                title: '测试页面'
            }, false);
        }
 
        function ShowHtml() {
            art.dialog.open('demo.htm', {
                width: '100%',
                height: '100%',
                top: '0px',
                title: '静态页面'
            }, false);
        }       
    </script>
     
    <!–[if IE 6]>
    <script>
        DD_belatedPNG.fix('.big .item a img,.big .item a:hover');
    </script> 
     
    <link href="css/css.css" rel="stylesheet" type="text/css" /> 
     
</head>
<body>
    <form id="form1" runat="server">
        <div class="big">       
            <div class="item"><a href="#" onclick="ShowFocusRoom(); return false;"><img src="images/2.png" /></a></div>
            <div class="item"><a href="#" onclick="ShowFocusRoom(); return false;"><img src="images/3.png" /></a></div>
            <div class="item"><a href="#" onclick="ShowHtml(); return false;"><img src="images/4.png" /></a></div>
            <div class="item"><a href="#" onclick="ShowHtml(); return false;"><img src="images/5.png" /></a></div>
            <div style=" clear:both;"></div>
        </div>
    </form>
</body>
</html>

  再在IE6上测试通过!

 

 

posted @   challengesoflife  阅读(1060)  评论(1编辑  收藏  举报
编辑推荐:
· [.NET]调用本地 Deepseek 模型
· 一个费力不讨好的项目,让我损失了近一半的绩效!
· .NET Core 托管堆内存泄露/CPU异常的常见思路
· PostgreSQL 和 SQL Server 在统计信息维护中的关键差异
· C++代码改造为UTF-8编码问题的总结
阅读排行:
· 一个费力不讨好的项目,让我损失了近一半的绩效!
· 清华大学推出第四讲使用 DeepSeek + DeepResearch 让科研像聊天一样简单!
· 实操Deepseek接入个人知识库
· CSnakes vs Python.NET:高效嵌入与灵活互通的跨语言方案对比
· Plotly.NET 一个为 .NET 打造的强大开源交互式图表库
点击右上角即可分享
微信分享提示