(5.16更新) MC Dialog 超酷js弹出层 完美兼容所有浏览器 华丽呈现超强功能

MC.Dialog 是由肖毅(YesSky) 开发一款界面绚丽美观 操作简单易用的一款js弹出层 MC.Dialog 是经过严格了测试的 兼容目前ie7+ 以及其他非ie核心的浏览器 具有高度的仿真浏览器自带的功能

 

(申明：MC Dialog 是原创作品 绝非是zcms中扣出的代码)

 

 

MC.Dialog支持键盘操作 支持焦点智能移动 支持焦点离开弹出层进行闪烁提示功能 支持按钮外接事件功能 支持拖拽功能 支持穿透iframe  支持多个MC.Dialog共存 队列操作功能 可以在弹出层中继续弹出层 经过测试MC.Dialog几乎已经完美

 

推荐使用MC.Dialog 让MC.Dialog来换掉ie那朴实的弹出框吧
MC.Dialog同时是免费而且是开源的 你可以随意使用 但为了尊重个人劳动成果 请加注版权信息 谢谢

如果觉得好，请大家顶起（也请大家保留文件中的版权申明）
如果在使用中发现任何问题或者有什么好的建议，请在此跟帖
演示地址 ： http://live126.cn/Admin/MC.Admin.Main.asp  

项目地址 :    http://live126.cn/project/MC.Dialog/

下载地址 :   http://live126.cn/project/MC.Dialog.js

下载后请将后缀名改为.rar 注意 有的系统默认是将已知的文件名后缀隐藏了的 你必须将文件后缀显示

文件后缀名显示方法

打开我的电脑 > 工具 > 文件夹选项 > 去掉已知文件类型后缀名的勾

 

5.15更新：
1.更新demo 添加更多的在实际应用中的例子
2.修复为了解决内存泄露问题采用绑定事件方法导致取消按钮和关闭按钮无法关闭的问题
3.再次优化内存回收，100%的回收了内存，但内存占用有一定的增加
4.修复在单一窗口下 在纵向定位不准的问题（开始MC.Dialog是为自己的cms而作的 cms的主框架是不会出现滚动条的）
5.8更新：

1.修复拖拽方法的内存泄露

2.修正弹出层的内存泄露

3.重写了大部分代码 优化了逻辑处理顺序

4.将MC Dialog分解为 标题栏 提示栏（同os的菜单栏） 主界面 按钮栏

5.初始化MC Dialog采用对以上四个部分赋值来实现 以便于准确操作

6.为父对象访问内嵌的Iframe提供了标准的接口

7.优化了监听机制 减少内存消耗

8.发现界面较大是标题栏出现小小的裂开 但拖动后又正常 这里暂未修改 （让俺休息会儿多 明天把界面也重写一次

 

5.6更新：

1.采用新的拖拽方法 解决在宽度和高度较大时MC Dialog在ff下拖拽有延迟和闪烁

 

更新说明

1.ie6支持半透明背景和阴影

2.ie6下将所有的可见select隐藏

3.Dialog的拖动范围限制 不再允许将MC Dialog拖出浏览器可视范围

4.修正加载远程内容时出现的层宽度变得十分长

5.修正重命名ID是书写的语法错误

6.已更新所有的演示demo和下载

 

演示操作 --  见下图

  顶部菜单 如图

   
 1.(模拟alert)  点击发布文章 弹出提示

  2.(模拟confirm)选中新闻 点发布文章 确认提示

 3.(高级功能，内嵌iframe操作) 添加新闻 > 添加分类 > 弹出对话框添加分类

4.（带按钮栏，可给按钮添加自定函数功能）按钮可操作内嵌iframe

 

5.（支持多个MC Dialog共存）支持队列操作 快捷键 智能焦点移动 智能提示(当焦点移出层外，闪烁提示)

评论

72 楼 z2009zxiaolong 2012-09-04  

感觉效果还不错。

71 楼 franlinzi 2010-10-31  

网站都不能访问了，怎么下载呢。请提供新的地址吧，或者传我邮箱[e-mail] ,我提供个空间啊

70 楼 xuanziday 2010-05-18  

llfzy 写道

不感冒、、。。。。。。感觉还是有很多问题

请指出具体的很多问题 谢谢

69 楼 llfzy 2010-05-18  

不感冒、、。。。。。。感觉还是有很多问题

68 楼 xuanziday 2010-05-17  

你好 这个问题确实有 不过我开始发现的时候 以很快的速度拖动并且不放开鼠标 试了很多次只看到了一次这样的场景  比较诡异  本省创建这个红色的快就是防止层在很大的情况下拖动出现的一些变态问题的 这个头痛

67 楼 weifeng9703 2010-05-16  

IE7下鼠标频繁拖拽，产生如下效果：

66 楼 xuanziday 2010-05-15  

5.15更新 添加更多实例 修复了一处bug  优化内存回收达到100%

65 楼 xuanziday 2010-05-14  

xkxx 写道

在Linux上显示全为乱码
你到底是使用哪一种编码的？

gb2312

64 楼 xkxx 2010-05-14  

在Linux上显示全为乱码
你到底是使用哪一种编码的？

63 楼 xuanziday 2010-05-08  

bluesky4485 写道

好像在IE8下面有内存泄露的问题，我每次往红色区域移动一下弹出一个框的时候内存基本上就得增加10M左右。第一次的时候没发现这个问题，结果我IE的内存就占到300M了。不知道是什么问题。

已经修正内存泄露的问题 关闭层后基本上是全部回收了内存的 不会出现内存泄露

62 楼 xuanziday 2010-05-08  

ainbax 写道

提交点 在 Chrome  上的 Bug
浏览器 4.1.249.1064

Dialog的拖动范围限制 不再允许将MC Dialog拖出浏览器可视范围
只有 右边和下边有效 左边和上边无效 可以拖出浏览器可视范围

当吧Dialog拖动到 最右或者最下边的时候，鼠标无法解除拖放状态

谢谢 我测试了一下没有出现逆所说的问题 可能是你的chrome版本比较老了 我测试的版本是5.0+

左侧和上边是没有控制的这个不是bug

非常谢谢这位朋友

61 楼 ainbax 2010-05-08  

提交点 在 Chrome  上的 Bug
浏览器 4.1.249.1064

Dialog的拖动范围限制 不再允许将MC Dialog拖出浏览器可视范围
只有 右边和下边有效 左边和上边无效 可以拖出浏览器可视范围

当吧Dialog拖动到 最右或者最下边的时候，鼠标无法解除拖放状态

60 楼 xuanziday 2010-05-07  

bluesky4485 写道

行: 81
错误: 'Dialog.Stock' 为空或不是对象

对我也看了一下在ie8下确实有内存泄露的问题
这可能是新的拖拽方法造成的 因为最开始的拖拽放我测试过 内存占用在3m左右
每次关闭后内存会后在一半左右

更新？是你自己修改过？  如果你修改了我不敢保证 没有修改的话 是不会出现脚本错误的 这个我到目前为止运行正常 为出现脚步错误

59 楼 bluesky4485 2010-05-07  

行: 81
错误: 'Dialog.Stock' 为空或不是对象

58 楼 bluesky4485 2010-05-07  

更新了一下结果直接用IE8打开就报脚本错误。

57 楼 bluesky4485 2010-05-07  

好像在IE8下面有内存泄露的问题，我每次往红色区域移动一下弹出一个框的时候内存基本上就得增加10M左右。第一次的时候没发现这个问题，结果我IE的内存就占到300M了。不知道是什么问题。

56 楼 xuanziday 2010-05-06  

MC Dialog再次更新 修正拖拽在ff下的延迟和闪烁问题 请大家下载最新版

如果绝对开始的拖拽比较好的话 就不用更新了

55 楼 xuanziday 2010-05-05  

kenchen0805 写道

弹出的窗口关都关不掉

不知道是什么浏览器？ 貌似就没有浏览器会有关不掉这种情况

肯定是有什么脚本错误 但是我可以肯定的告诉你在我的演示界面 是没有问题的
5.1前演示页面在ff下有的问题但都不是MC Dialog本身的问题

54 楼 kenchen0805 2010-05-04  

弹出的窗口关都关不掉

53 楼 xuanziday 2010-05-03  

plusir 写道

首先感谢lz的无私分享。
我自己也写了个类似的东西在项目中使用，遇到一些问题，想跟lz讨论下，看看lz的组件是不是已经解决了。

其实这个东西的实现还是很简单的，我的做法是 div+iframe，这样可以做到遮盖iframe和select。在跨框架的问题上，我的做法是在window.top上实例化该js类，然后在自己的框架类上定义一个方法：

var xajax = {};
xajax.alert = function( text )
{
    if( window.top.dialogObject )
        window.top.dialogObject.alert( text );
    else
        alert( text ) ;
};

上面的代码很简单，就是所有需要alert的地方都调用xajax.alert，该方法自行判断顶层dialog组件是否可用，如果可用就调用dialog组件的alert方法，如果不可用，就调用window.alert方法。

实现上不难，难点在于模拟alert、confirm的阻塞行为，比如一段js验证失败的代码，我们要求提示信息之后自动把焦点置到验证失败的输入框上

传统写法：

if( username.getValue() == "" )
{
    alert( pageLocale.validate.username.failed ) ;
    username.focus() ;
};

如果用自己写的dialog组件，alert的时候显然是不能阻塞的。我目前的做法加了一个回调方法来做相同的事

xajax.alert = function( text, callback )
{
    ....
};

if( username.getValue() == "" )
{
    xajax.alert(
       pageLocale.validate.username.failed,
       function() { username.focus(); }
    );
};

但是总觉得这种方式很丑陋而且问题很大

• 也有些情况是非阻塞不可的
• confirm需要两个callback－ok跟cancel
• 如果弹出的是个对话框，要处理returnValue，更麻烦

不知道lz是不是也考虑过这种情况，是怎么解决的。

单纯实现解释执行（实现alert confirm的阻塞执行是很困难的 几乎无法实现）

模拟confirm目前都是这样做的 confirm一个确定 一个取消按钮 分别给他们绑定回调函数 来实现

自定义弹出层无法实现阻塞执行 虽然能做出来 但几乎无法封装好

比如 alert("abc");alert("der");将同时弹出两个alert对话框而不是确定之后再弹出另外一个

MC Dialog是将层创建到最顶级window对象dom中的

MC Dialog 是将系统自带的alert confirm方法覆盖了的 alert方法你只需要像以前一样调用即可 confirm方法必须带有至少一个参数 调用如confirm('你确定？',function(){//确定按钮方法},function(){//取消按钮方法}) //第二个第三个方法是不必须的 但是不带的话是同alert没有多大去别的 实际中还是要用

MC Dialog 已更新了 你可以看看代码 对你有帮助的话就最好了

也希望多多交流共同进步