利用js对象弹出一个层


Posted in Javascript onMarch 26, 2008
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />  
<title>三水点靠木-弹出一个层</title>  
<script language="javascript">  
function cmsgbox(vtitle,vwidth,vhight,vtop,vleft)  
{  
 this.title=vtitle;  
 this.width=vwidth;  
 this.height=vhight;  
 this.top=vtop;  
 this.left=vleft;  
 this.id=0;  
}  
cmsgbox.prototype.showdiv=function()  
{  
 var str="";  
 str+="<div id='div1' style='z-index:1;background-color:white;position:absolute;border:2px solid slategray;left:"+this.vleft+"px;top:"+this.vtop+"px;width:"+this.width+"px;'>";   str+="<div style='padding-bottom:2px;background-color:slategray;width:100%;height:16px;color:white;' >";  
 str+=" <div style='float:left;height:16px;overflow:hidden;margin:0px;padding:4px 0px 0px 5px;width:"+(parseInt(this.width)-24*2-5)+"px;'>"+this.title+"</div>";  
 str+=" <span style='width:14px;font-family:webdings;cursor:hand;'>0</span>";  
 str+=" <span style='width:14px;font-family:webdings;cursor:hand;'  onclick='cmsgbox.closediv(this);'>r</span>";  
 str+="</div>";  
 str+="<div style=' margin:10px 5px 10px 10px;word-break:break-all;'>";  
 str+="xxx";  
 str+="</div>";  
 str+="</div>";  
 //document.write(str);  
 document.body.insertAdjacentHTML("beforeEnd",str);  
}  
/////////////////////窗口显示//////////////////////////////  
function show()  
{  
 var box=new cmsgbox('小家伙呀',400,300);  
 box.showdiv();  
}  
</script>  
</head>  
<style>  
body{  
 font-size:12px;  
}  
</style>  
<body>  
<p onclick="show();">弹了一个层</p>  
</body>  
</html> 
Javascript 相关文章推荐
javascript[js]获取url参数的代码
Oct 17 Javascript
js每次Title显示不同的名言
Sep 25 Javascript
原生javascript实现DIV拖拽并计算重复面积
Jan 02 Javascript
JQuery选中checkbox方法代码实例(全选、反选、全不选)
Apr 27 Javascript
在Mac OS下使用Node.js的简单教程
Jun 24 Javascript
jQuery实现仿百度首页滑动伸缩展开的添加服务效果代码
Sep 09 Javascript
JavaScript实现定时页面跳转功能示例
Feb 14 Javascript
fckeditor部署到weblogic出现xml无法读取及样式不能显示问题的解决方法
Mar 24 Javascript
使用vue制作滑动标签
Sep 21 Javascript
js实现百度淘宝搜索功能
Feb 17 Javascript
es6数组includes()用法实例分析
Apr 18 Javascript
jQuery实现容器间的元素拖拽功能
Dec 01 jQuery
javascript YUI 读码日记之 YAHOO.util.Dom - Part.4
Mar 22 #Javascript
Javascript YUI 读码日记之 YAHOO.util.Dom - Part.3
Mar 22 #Javascript
Javascript YUI 读码日记之 YAHOO.util.Dom - Part.2 0
Mar 22 #Javascript
YUI 读码日记之 YAHOO.util.Dom - Part.1
Mar 22 #Javascript
YUI 读码日记之 YAHOO.lang.is*
Mar 22 #Javascript
详解new function(){}和function(){}() 区别分析
Mar 22 #Javascript
Javascript的一种模块模式
Mar 22 #Javascript
You might like
php获取错误信息的方法
2015/07/17 PHP
php面向对象值单例模式
2016/05/03 PHP
事件冒泡是什么如何用jquery阻止事件冒泡
2013/03/20 Javascript
jquery $.fn $.fx是什么意思有什么用
2013/11/04 Javascript
JavaScript简单修改窗口大小的方法
2015/08/03 Javascript
Jquery实现的简单轮播效果【附实例】
2016/04/19 Javascript
Vuejs第一篇之入门教程详解(单向绑定、双向绑定、列表渲染、响应函数)
2016/09/09 Javascript
jQuery flip插件实现的翻牌效果示例【附demo源码下载】
2016/09/20 Javascript
TypeScript入门-接口
2017/03/30 Javascript
JavaScript实现网页头部进度条刷新
2017/04/16 Javascript
详解前后端分离之VueJS前端
2017/05/24 Javascript
vue 自定义组件 v-model双向绑定、 父子组件同步通信的多种写法
2017/11/27 Javascript
jquery实现的简单轮播图功能【适合新手】
2018/08/17 jQuery
基于webpack4.X从零搭建React脚手架的方法步骤
2018/12/23 Javascript
微信小程序动态显示项目倒计时
2019/06/20 Javascript
实现vuex与组件data之间的数据同步更新方式
2019/11/12 Javascript
vue v-on:click传递动态参数的步骤
2020/09/11 Javascript
Python实现的自定义多线程多进程类示例
2018/03/23 Python
Python连接Mssql基础教程之Python库pymssql
2018/09/16 Python
python面向对象法实现图书管理系统
2019/04/19 Python
使用NumPy读取MNIST数据的实现代码示例
2019/11/20 Python
python实现引用其他路径包里面的模块
2020/03/09 Python
Python验证码截取识别代码实例
2020/05/16 Python
通过实例解析Python RPC实现原理及方法
2020/07/07 Python
如何利用python生成MD5并去重
2020/12/07 Python
澳大利亚游乐场设备品牌:Lifespan Kids
2019/05/24 全球购物
澳大利亚在线奢侈品时尚零售平台:Azura Runway
2021/01/13 全球购物
什么是静态路由,其特点是什么?什么是动态路由,其特点是什么?
2013/07/26 面试题
劳资专员岗位职责
2013/12/27 职场文书
前处理班长职位说明书
2014/03/01 职场文书
安全生产大检查方案
2014/05/07 职场文书
端午节演讲稿
2014/05/23 职场文书
城市规划应届毕业生自荐信
2014/07/04 职场文书
小学生我的梦想演讲稿
2014/08/21 职场文书
小学生美德少年事迹材料
2014/08/24 职场文书
违反工作规定检讨书范文
2014/12/14 职场文书