弹出层测试
一个简单的JS弹出层
基本功能
//主函数 id:内容,strTitle:标题,fn_msgBoxBack:关闭时回调函数,notShowClose:是否隐藏关闭按钮
function msgBox(id, strTitle, fn_msgBoxBack, hideClose)
//主函数 id:内容ID,strTitle:标题,fn_msgBoxBack:关闭时回调函数,notShowClose:是否隐藏关闭按钮
msgBox(id, strTitle, fn_msgBoxBack, hideClose)
msgBox_close() 关闭对话框
msgBox_alert(strAlert, strTitle) 提示框
msgBox_loading(strAlert, strTitle) 加载中
快捷键ESC关闭对话框
兼容 IE、FireFox、Chrome
主要遇到的问题
取父节点应当使用 div.parentNode;
取鼠标位置
1 2 3 4 5 6 | onmousedown= "msgBox_moveStart(event);" function msgBox_moveStart(evt){ evt = evt ? evt : (window.event ? window.event : null ); msgBox_mouseX = evt.clientX; msgBox_mouseY = evt.clientY; } |
style.left、style.top、style.width、style.height 附值时,应当加上 px
div.style.left = left + 'px';
添加事件
1 2 3 4 5 | if (isIE){ document.attachEvent( 'onmousemove' , msgBox_move); } else { document.addEventListener( 'mousemove' , msgBox_move, false ); } |
获取页面总宽度(包含非可见区域)document.documentElement.scrollWidth
透明度
1 2 3 4 5 6 7 | if (isIE){ div.style.filter = 'Alpha(opacity=20)' ; } else if (navigator.userAgent.indexOf( "Chrome" ) > -1) //判断是否Chrome{ div.style.opacity = 0.2; } else { div.style.MozOpacity = 0.2; } |
实例及源码 下载
欢迎转载,转载请注明:转载自[ http://www.cnblogs.com/zjfree/ ]
分类:
Javascript
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· PostgreSQL 和 SQL Server 在统计信息维护中的关键差异
· C++代码改造为UTF-8编码问题的总结
· DeepSeek 解答了困扰我五年的技术问题
· 为什么说在企业级应用开发中,后端往往是效率杀手?
· 用 C# 插值字符串处理器写一个 sscanf
· DeepSeek智能编程
· 精选4款基于.NET开源、功能强大的通讯调试工具
· [翻译] 为什么 Tracebit 用 C# 开发
· 腾讯ima接入deepseek-r1,借用别人脑子用用成真了~
· DeepSeek崛起:程序员“饭碗”被抢,还是职业进化新起点?