juery框架写的弹窗效果适合新手


Posted in Javascript onNovember 27, 2013

本人新手写点代码有点村,希望大家多多包含!!!!!!

<html> 
<head> 
<title>js弹窗效果</title> 
<meta http-equiv="content-type" content="text/html charset=gb2312"> 
<script language="javascript" src="jquery-1.4.js"></script> 
</head> <script language="javascript"> 
//document.body.offsetWidth="512px"; 
function mina(){ 
$("#dv").css("display","block"); 
var a = $(document).height(); 
var b = $(window).width(); 
var h =$(window).height(); 
f = (b-300)/2; 
d =(h-300)/2; 
$("#dv").css("margin-top",d); 
$("#dv").css("margin-left",f); 
$("#zhezhao").toggle(); 
$("#zhezhao").css("width",b); 
$("#zhezhao").css("height",a); 
} 
function nin(){ 
$("#dv").css("display","none"); 
$("#zhezhao").toggle(); 
} 
</script> 
<body> 
<div style="display:none;position:absolute;z-index:100;background:#ccc" id="zhezhao"></div> 
<input type="button" value="点击" onclick="mina()"> 
<div id="dv" style="width:300px;height:300px;border:1px solid red;display:none;position:absolute;z-index:1000;background:white;"> 
<div><span id="ss"style="width:30px;height:30px;border:1px solid blue;background:black;float:right;" onclick="nin()"></span></div> 
</div> 
<table align="center" border="1" width="888" height="668"> 
<tr> 
<td align="center">haha</td> 
</tr> 
</table> 
</body> 
</html>

如果对你有帮助也算没有白白上传!!!!!!(需要了解jquery框架)
Javascript 相关文章推荐
javascript 图片上一张下一张链接效果代码
Mar 12 Javascript
jQuery 1.5.1 发布,全面支持IE9 修复大量bug
Feb 26 Javascript
JS通过调用微信API实现微信支付功能的方法示例
Jun 29 Javascript
Vue上传组件vue Simple Uploader的用法示例
Aug 25 Javascript
基于webpack4.X从零搭建React脚手架的方法步骤
Dec 23 Javascript
使用javascript做时间倒数读秒功能的实例
Jan 23 Javascript
小试小程序云开发(小结)
Jun 06 Javascript
小程序实现搜索框
Jun 19 Javascript
VUE实现移动端列表筛选功能
Aug 23 Javascript
vue组件命名和props命名代码详解
Sep 01 Javascript
layer实现弹出层自动调节位置
Sep 05 Javascript
vue实现多个echarts根据屏幕大小变化而变化实例
Jul 19 Javascript
js使用数组判断提交数据是否存在相同数据
Nov 27 #Javascript
js每隔5分钟执行一次ajax请求的实现方法
Nov 27 #Javascript
js字符串截取函数substr substring slice使用对比
Nov 27 #Javascript
JS如何判断移动端访问设备并解析对应CSS
Nov 27 #Javascript
javascript如何动态加载表格与动态添加表格行
Nov 27 #Javascript
Js实现当前点击a标签变色突出显示其他a标签回复原色
Nov 27 #Javascript
showModalDialog在谷歌浏览器下会返回Null的解决方法
Nov 27 #Javascript
You might like
预告映像公开!第1章续篇剧场版动画《Princess Principal Crown Handler》4月10日上映!
2020/03/06 日漫
PHP经典的给图片加水印程序
2006/12/06 PHP
解析ajax事件的调用顺序
2013/06/17 PHP
ThinkPHP中处理表单中的注意事项
2014/11/22 PHP
yii去掉必填项中星号的方法
2015/12/28 PHP
PHP中set_include_path()函数相关用法分析
2016/07/18 PHP
在VS2008中使用jQuery智能感应的方法
2010/12/30 Javascript
jquery map方法使用示例
2014/04/23 Javascript
javascript 判断整数方法分享
2014/12/16 Javascript
JQuery鼠标移到小图显示大图效果的方法
2015/06/10 Javascript
跟我学习javascript的异步脚本加载
2015/11/20 Javascript
js+html5实现canvas绘制网页时钟的方法
2016/05/21 Javascript
使用jquery提交form表单并自定义action的方法
2016/05/25 Javascript
js实现非常棒的弹出div
2016/10/06 Javascript
微信小程序 缓存(本地缓存、异步缓存、同步缓存)详解
2017/01/17 Javascript
详解使用vscode+es6写nodejs服务端调试配置
2017/09/21 NodeJs
Vue编写可显示周和月模式的日历 Vue自定义日历内容的显示
2019/06/26 Javascript
JavaScript实现Tab选项卡切换
2020/02/13 Javascript
vue 自定指令生成uuid滚动监听达到tab表格吸顶效果的代码
2020/09/16 Javascript
微信小程序实现页面左右滑动
2020/11/16 Javascript
利用python如何处理nc数据详解
2018/05/23 Python
PyTorch学习笔记之回归实战
2018/05/28 Python
Python大数据之网络爬虫的post请求、get请求区别实例分析
2019/11/16 Python
python多线程爬取西刺代理的示例代码
2021/01/30 Python
Boda Skins皮衣官网:奢侈皮夹克,全球配送
2016/12/15 全球购物
泰国排名第一的家居用品中心:HomePro
2020/11/18 全球购物
C#中的验证控件有几种
2014/03/08 面试题
Servlet面试题库
2015/07/18 面试题
最新计算机专业自荐信
2013/10/16 职场文书
风险评估实施方案
2014/03/09 职场文书
中学生操行评语
2014/04/24 职场文书
项目建议书模板
2014/05/12 职场文书
小学感恩教育活动总结
2014/07/07 职场文书
大学拉赞助协议书范文
2014/09/26 职场文书
课外活动实习计划
2015/01/19 职场文书
原告代理词范文
2015/05/25 职场文书