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中null与undefined分析
Jul 25 Javascript
JQuery autocomplete 使用手册
Apr 01 Javascript
javascript AOP 实现ajax回调函数使用比较方便
Nov 20 Javascript
JS正则表达式大全(整理详细且实用)
Nov 14 Javascript
jQuery产品间断向下滚动效果核心代码
May 08 Javascript
jquery实现textarea输入框限制字数的方法
Jan 15 Javascript
AngularJS 简单应用实例
Jul 28 Javascript
利用js查找数组中指定元素并返回该元素的所有索引示例
Mar 29 Javascript
Angular2入门教程之模块和组件详解
May 28 Javascript
基于EasyUI的基础之上实现树形功能菜单
Jun 28 Javascript
vue-router2.0 组件之间传参及获取动态参数的方法
Nov 10 Javascript
分享Angular http interceptors 拦截器使用(推荐)
Nov 10 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
eWebEditor v3.8 商业完整版 (PHP)
2006/12/06 PHP
php email邮箱正则
2008/10/08 PHP
php抽奖小程序的实现代码
2013/06/18 PHP
PHP  Yii清理缓存的实现方法
2016/11/10 PHP
通过 Dom 方法提高 innerHTML 性能
2008/03/26 Javascript
JS面向对象、prototype、call()、apply()
2009/05/14 Javascript
JQuery 操作Javascript对象和数组的工具函数小结
2010/01/22 Javascript
简单的Jquery遮罩层代码实例
2013/11/14 Javascript
Javascript中的String对象详谈
2014/03/03 Javascript
js中top的作用深入剖析
2014/03/04 Javascript
jquery的总体架构分析及实现示例详解
2014/11/08 Javascript
理解js对象继承的N种模式
2016/01/25 Javascript
JavaScript仿商城实现图片广告轮播实例代码
2016/02/06 Javascript
js初始化验证实例详解
2016/11/26 Javascript
EasyUI Combobox设置默认值 获取text的方法
2016/11/28 Javascript
jQuery中的select操作详解
2016/11/29 Javascript
Vue 过渡实现轮播图效果
2017/03/27 Javascript
Vue-cli创建项目从单页面到多页面的方法
2017/09/20 Javascript
微信禁止下拉查看URL的处理方法
2017/09/28 Javascript
vue中的计算属性的使用和vue实例的方法示例
2017/12/04 Javascript
vue 插值 v-once,v-text, v-html详解
2018/01/19 Javascript
Python获取运行目录与当前脚本目录的方法
2015/06/01 Python
python贪婪匹配以及多行匹配的实例讲解
2018/04/19 Python
Python面向对象程序设计类的多态用法详解
2019/04/12 Python
Docker部署Python爬虫项目的方法步骤
2020/01/19 Python
Python动态导入模块和反射机制详解
2020/02/18 Python
印尼旅游网站:via
2017/11/12 全球购物
Ancheer官方户外和运动商店:销售电动自行车
2019/08/07 全球购物
英国羊皮鞋类领先品牌:Just Sheepskin
2019/12/12 全球购物
中药专业大学生医药工作求职信
2013/10/25 职场文书
员工工作表扬信范文
2014/01/13 职场文书
总经理助理职责
2014/02/04 职场文书
《桃花心木》教学反思
2014/02/17 职场文书
2015年业务员工作总结范文
2015/04/07 职场文书
公司考勤管理制度
2015/08/04 职场文书
2016年9月份红领巾广播稿
2015/12/21 职场文书