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 相关文章推荐
一些mootools的学习资源
Feb 07 Javascript
javascript分页代码(当前页码居中)
Sep 20 Javascript
javascript loadScript异步加载脚本示例讲解
Nov 14 Javascript
详解ECharts使用心得总结
Dec 06 Javascript
vue-router 中router-view不能渲染的解决方法
May 23 Javascript
微信小程序中使用Promise进行异步流程处理的实例详解
Aug 17 Javascript
利用nginx + node在阿里云部署https的步骤详解
Dec 19 Javascript
Vue中错误图片的处理的实现代码
Nov 07 Javascript
js实现点赞效果
Mar 16 Javascript
详解微信小程序入门从这里出发(登录注册、开发工具、文件及结构介绍)
Jul 21 Javascript
前端性能优化建议
Sep 17 Javascript
帮你提高开发效率的JavaScript20个技巧
Jun 18 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
ThinkPHP缓存方法S()概述
2014/06/13 PHP
php + ajax 实现的写入数据库操作简单示例
2020/05/16 PHP
Prototype最新版(1.5 rc2)使用指南(1)
2007/01/10 Javascript
jquery插件如何使用 jQuery操作Cookie插件使用介绍
2012/12/15 Javascript
WebApi+Bootstrap+KnockoutJs打造单页面程序
2016/05/16 Javascript
jQuery文字横向滚动效果的实现代码
2016/05/31 Javascript
Nodejs下DNS缓存问题浅析
2016/11/16 NodeJs
JS实现颜色的10进制转化成rgba格式的方法
2017/09/04 Javascript
Vue 多层组件嵌套二种实现方式(测试实例)
2017/09/08 Javascript
Node.JS使用Sequelize操作MySQL的示例代码
2017/10/09 Javascript
JavaScript实现数值自动增加动画
2017/12/28 Javascript
Vue打包后出现一些map文件的解决方法
2018/02/13 Javascript
Vue 仿QQ左滑删除组件功能
2018/03/12 Javascript
在 Linux/Unix 中不重启 Vim 而重新加载 .vimrc 文件的流程
2018/03/21 Javascript
JS使用JSON.parse(),JSON.stringify()实现对对象的深拷贝功能分析
2019/03/06 Javascript
webpack的pitching loader详解
2019/09/23 Javascript
jQuery操作元素的内容和样式完整实例分析
2020/01/10 jQuery
Vue Element校验validate的实例
2020/09/21 Javascript
vue的$http的get请求要加上params操作
2020/11/12 Javascript
vue中defineProperty和Proxy的区别详解
2020/11/30 Vue.js
python删除列表元素的三种方法(remove,pop,del)
2019/07/22 Python
keras模型可视化,层可视化及kernel可视化实例
2020/01/24 Python
Java如何基于wsimport调用wcf接口
2020/06/17 Python
python爬虫请求头设置代码
2020/07/28 Python
html5移动端自适应布局的实现
2020/04/15 HTML / CSS
Crocs美国官方网站:卡骆驰洞洞鞋
2017/08/04 全球购物
Deux par Deux官方网站:设计师童装
2020/01/03 全球购物
How TDD works
2012/09/30 面试题
新法人代表任命书
2014/06/06 职场文书
法制演讲稿
2014/09/10 职场文书
2014小学语文教学工作总结
2014/12/17 职场文书
如何写辞职书
2015/02/26 职场文书
求职简历自我评价怎么写
2015/03/10 职场文书
2016年学校“3.12”植树节活动总结
2016/03/16 职场文书
Python中使用subprocess库创建附加进程
2021/05/11 Python
gojs实现蚂蚁线动画效果
2022/02/18 Javascript