<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>【强烈推荐】 超漂亮的仿腾讯弹出层效果(兼容主流浏览器)</title>
<style>
body {background: #ffffff; color: #444;}
a{ color: #09d; text-decoration: none; border: 0; background-color: transparent;}
body,div,q,iframe,form,h5{ margin: 0; padding: 0;}
img,fieldset { border: none 0; }
body,td,textarea { word-break: break-all; word-wrap: break-word; line-height:1.5;}
body,input,textarea,select,button { margin: 0; font-size: 12px; font-family: Tahoma, SimSun, sans-serif;}
div,p,table,th,td { font-size:1em; font-family:inherit; line-height:inherit;}
h5{ font-size:12px;}
</style>
<script type="text/javascript" src="Dialog.js"></script>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
function zOpenD(){
var diag = new Dialog("Diag1");
diag.Width = 900;
diag.Height = 400;
diag.Title = "弹出窗口示例";
diag.URL = "test.htm";
diag.ShowMessageRow = true;
diag.MessageTitle = "弹出窗口示例";
diag.Message = "在这儿你可以对这个窗口的内容或功能作一些说明";
diag.OKEvent = afterSelect; //点击确定后调用的方法
goBack = function(params)
{
$("#div1").html(params);
//alert(params);
//$(ele).val(params);
}
diag.show();
}
function goBack(params)
{
alert(params)
}
function afterSelect()
{
$DW.onOK();
}
function zOpen(){
var diag = new Dialog("Diag2");
diag.Width = 900;
diag.Height = 400;
diag.Title = "弹出窗口示例";
diag.URL = "http://demo.zving.com/";
diag.OKEvent = zAlert;//点击确定后调用的方法
diag.show();
}
function zOpenInner(){
var diag = new Dialog("Diag3");
diag.Width = 300;
diag.Height = 100;
diag.Title = "弹出窗口示例";
diag.innerHTML='<div style="text-align:center">直接输出html,使用dialog.<b>innerHTML</b>。</div>'
diag.OKEvent = function(){diag.close();};//点击确定后调用的方法
diag.show();
}
function zOpenEle(){
var diag = new Dialog("Diag4");
diag.Width = 300;
diag.Height = 100;
diag.Title = "弹出窗口示例";
diag.innerElementId="forlogin"
diag.OKEvent = function(){$E.getTopLevelWindow().$("username").value||alert("用户名不能为空");$E.getTopLevelWindow().$("userpwd").value||alert("密码不能为空")};//点击确定后调用的方法
diag.show();
}
function zAlert(){
Dialog.alert("你点击了一个按钮");
}
function zConfirm(){
Dialog.confirm('警告:您确认要XXOO吗?',function(){Dialog.alert("yeah,周末到了,正是好时候");});
}
function sometext(ele,n){
var strArr=["可","以","清","心","也"];
var writeStr=""
for(i=0;i<n;i++){
index=parseInt(Math.random()*5);
for(j=0;j<5;j++){
str=index+j>4?index+j-5:index+j;
writeStr+=strArr[str];
}
}
$(ele).innerHTML=writeStr;
}
</script>
</head>
<body>
<div id="div1"></div>
<p> <input type="button" value="弹出新窗口" onclick="zOpen()" /> <input type="button" value="弹出带说明的新窗口" onclick="zOpenD()" /> <input type="button" value="弹出信息提示对话框" onclick="zAlert()" /> <input type="button" value="弹出选择对话框" onclick="zConfirm()" /> <input type="button" value="弹出内容为HTML代码" onclick="zOpenInner()" /> <input type="button" value="弹出内容为本页面内的隐藏层" onclick="zOpenEle()" /> <select name="select1">
<option>不要挡住我,不要挡住我</option>
<option>不要挡住我,不要挡住我</option>
<option>不要挡住我,不要挡住我</option>
</select></p>
<div id="div2"></div>
<div id="forlogin"><table width="100%" border="0" align="center" cellpadding="4" cellspacing="4" bordercolor="#666666">
<tr>
<td colspan="2" bgcolor="#eeeeee">用户登陆</td>
</tr>
<tr>
<td width="50" align="right">用户名</td>
<td>
<input type="text" id="username" /> </td>
</tr>
<tr>
<td align="right">密 码</td>
<td>
<input type="text" id="userpwd" /> </td>
</tr>
</table></div>
<script>sometext("div1",200);sometext("div2",200);</script>
</body>
</html>
没有合适的资源?快使用搜索试试~ 我知道了~
超漂亮的仿腾讯弹出框效果(兼容主流浏览器)
共35个文件
png:19个
gif:7个
js:3个
需积分: 10 12 下载量 26 浏览量
2009-10-31
15:54:44
上传
评论
收藏 253KB RAR 举报
温馨提示
强烈推荐,功能强大,超漂亮的弹出框效果,兼容ie6/7/8 firefox2/3 提取自ZCMS的弹出层,无外部css文件,引用Dialog.js即可使用, 兼容主流浏览器,支持ie6下的阴影和半透明效果,不会ie6下不被select控件穿透 支持回调与父窗xx互,对iframe下的应用作了很多的处理,适合复杂的应用情况,
资源推荐
资源详情
资源评论
收起资源包目录
Dialog.rar (35个子文件)
Dialog
test.htm 12KB
[强烈推荐] 超漂亮的仿腾讯弹出层效果(兼容主流浏览器).html 3KB
main.htm 10KB
[强烈推荐] 超漂亮的仿腾讯弹出框效果(兼容主流浏览器).html 4KB
Main.js 148KB
images
dialog_mlb.png 3KB
icon_alert.gif 680B
dialog_mrt.png 3KB
dialog_lt.png 3KB
dialog_rb.png 3KB
dialog_mrb.png 3KB
dialog_lb.png 3KB
window.gif 1KB
dialog_mc.gif 1KB
dialog_mrm.png 3KB
snap.png 109KB
icon_dialog.gif 92B
dialog_closebtn_over.gif 441B
dialog_footerleft.png 3KB
dialog_closebtn.png 3KB
icon_query.gif 687B
dialog_mlt.png 3KB
dialog_closebtn_over.png 3KB
dialog_footercenter.png 3KB
Thumbs.db 34KB
dialog_closebtn.gif 388B
dialog_ct.png 6KB
dialog_mlm.png 3KB
dialog_cb.png 4KB
dialog_footerright.png 3KB
dialog_rt.png 3KB
dialog_bg.jpg 22KB
dialog_mc.png 4KB
Dialog.js 30KB
jquery.js 53KB
共 35 条
- 1
资源评论
gxda112
- 粉丝: 5
- 资源: 13
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
最新资源
- STM32单片机FPGA毕设电路原理论文报告一种基于st62单片机的称重显示控制器
- STM32单片机FPGA毕设电路原理论文报告一种基于SPCE061A单片机的信号发生器
- Ruby菜鸟入门指南.md
- STM32单片机FPGA毕设电路原理论文报告一种基于PIC系列单片机的SPWM逆变电源
- exp01A.cpp
- Rust语言学习万字指南!.md
- STM32单片机FPGA毕设电路原理论文报告一种基于msp430单片机的心电模块设计
- STM32单片机FPGA毕设电路原理论文报告一种基于MSP430单片机的日程管理系统
- web-screen-capture.jar
- 2024最新计算机二级真题练习题库含答案.md
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功