利用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 相关文章推荐
将jQuery应用于login页面的问题及解决
Oct 17 Javascript
一款Jquery 分页插件的改造方法(服务器端分页)
Jul 11 Javascript
JQuery选择器特辑 详细小结
May 14 Javascript
jQuery使用一个按钮控制图片的伸缩实现思路
Apr 19 Javascript
绑定回车enter事件代码
May 18 Javascript
RequireJS 依赖关系的实例(推荐)
Jan 21 Javascript
vue实现todolist单页面应用
Apr 11 Javascript
JavaScript中如何判断一个值的类型
Sep 15 Javascript
javascript高仿热血传奇游戏实现代码
Feb 22 Javascript
JS栈stack类的实现与使用方法示例
Jan 31 Javascript
vue2.x 通过后端接口代理,获取qq音乐api的数据示例
Oct 30 Javascript
node.js事件轮询机制原理知识点
Dec 22 Javascript
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语法(3)
2006/10/09 PHP
如何在WIN2K下安装PHP4.04
2006/10/09 PHP
php ss7.5的数据调用 (笔记)
2010/03/08 PHP
Zend Framework教程之Bootstrap类用法概述
2016/03/14 PHP
JavaScript 全角转半角部分
2009/10/28 Javascript
精通Javascript系列之数值计算
2011/06/07 Javascript
javascript权威指南 学习笔记之javascript数据类型
2011/09/24 Javascript
window.open关于浏览器拦截问题分析及解决方法
2013/02/05 Javascript
js里取容器大小、定位、距离等属性搜集整理
2013/08/19 Javascript
Javascript中Array用法实例分析
2015/06/13 Javascript
Bootstrap每天必学之工具提示(Tooltip)插件
2016/04/26 Javascript
JS控制层作圆周运动的方法
2016/06/20 Javascript
Vue-Cli中自定义过滤器的实现代码
2017/08/12 Javascript
React-intl 实现多语言的示例代码
2017/11/03 Javascript
基于vue-cli配置lib-flexible + rem实现移动端自适应
2017/12/26 Javascript
微信、QQ、微博、Safari中使用js唤起App
2018/01/24 Javascript
基于nodejs res.end和res.send的区别
2018/05/14 NodeJs
vue watch关于对象内的属性监听
2019/04/22 Javascript
vue-cli4.x创建企业级项目的方法步骤
2020/06/18 Javascript
解决VUEX的mapState/...mapState等取值问题
2020/07/24 Javascript
小程序实现可拖动的悬浮按钮
2020/09/07 Javascript
django模型层(model)进行建表、查询与删除的基础教程
2017/11/21 Python
Python 3.7新功能之dataclass装饰器详解
2018/04/21 Python
Tensorflow使用tfrecord输入数据格式
2018/06/19 Python
Python Matplotlib库安装与基本作图示例
2019/01/09 Python
Numpy之random函数使用学习
2019/01/29 Python
Virtualenv 搭建 Py项目运行环境的教程详解
2020/06/22 Python
scrapy头部修改的方法详解
2020/12/06 Python
Python基于opencv的简单图像轮廓形状识别(全网最简单最少代码)
2021/01/28 Python
分解成质因数(如435234=251*17*17*3*2,据说是华为笔试题)
2014/07/16 面试题
优秀员工年终发言演讲稿
2014/01/01 职场文书
工作时间上网检讨书
2014/02/03 职场文书
党员学习中共十八大报告思想汇报
2014/09/15 职场文书
2019年教师入党申请书
2019/06/27 职场文书
Mac M1安装mnmp (Mac+Nginx+MySQL+PHP) 开发环境
2021/03/29 PHP
python实现网络五子棋
2021/04/11 Python