<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>W3Cschool可拖动DIV提示窗口</title>

<script language="javascript">

function alertWin(title, msg, w, h){

	var titleheight = "22px"; // 提示窗口标题高度

	var bordercolor = "#666699"; // 提示窗口的边框颜色

	var titlecolor = "#FFFFFF"; // 提示窗口的标题颜色

	var titlebgcolor = "#666699"; // 提示窗口的标题背景色

	var bgcolor = "#FFFFFF"; // 提示内容的背景色 

	var iWidth = document.documentElement.clientWidth;

	var iHeight = document.documentElement.clientHeight;

	var bgObj = document.createElement("div");

	var maxHeight = Math.max(document.body.clientHeight, iHeight);

	bgObj.style.cssText = "position:absolute;left:0px;top:0px;width:"+iWidth+"px;height:"+maxHeight+"px;filter:Alpha(Opacity=30);opacity:0.3;background-color:#000000;z-index:101;";

	document.body.appendChild(bgObj); 

	var msgObj=document.createElement("div");

	var height = (iHeight-h)/2;

	var width=(iWidth-w)/2;

	msgObj.style.cssText = "overflow-y:scroll;overflow-x:hidden;position:absolute;font:11px '宋体';top:"+height+"px;left:"+width+"px;width:"+w+"px;height:"+h+"px;text-align:center;border:1px solid "+bordercolor+";background-color:"+bgcolor+";padding:1px;line-height:22px;z-index:102;";

	document.body.appendChild(msgObj); 

	var table = document.createElement("table"); //www.w3cschool.cn w3cschool

	msgObj.appendChild(table);

	table.style.cssText = "margin:0px;border:0px;padding:0px;";

	table.cellSpacing = 0;

	var tr = table.insertRow(-1);

	tr.style.cssText="width:"+w+"px;position:fixed;margin-top:-1px;";

	var titleBar = tr.insertCell(-1);

	titleBar.style.cssText = "width:100%;height:"+titleheight+"px;text-align:left;padding:3px;margin:0px;font:bold 13px '宋体';color:"+titlecolor+";border:1px solid " + bordercolor + ";cursor:move;background-color:" + titlebgcolor;

	titleBar.style.paddingLeft = "10px";

	titleBar.innerHTML = title;

	var moveX = 0;

	var moveY = 0;

	var moveTop = 0;

	var moveLeft = 0;

	var moveable = false;

	var docMouseMoveEvent = document.onmousemove; //www.w3cschool.cn w3cschool

	var docMouseUpEvent = document.onmouseup;

	titleBar.onmousedown = function() {

	var evt = getEvent();

	moveable = true;

	moveX = evt.clientX;

	moveY = evt.clientY;

	moveTop = parseInt(msgObj.style.top);

	moveLeft = parseInt(msgObj.style.left); 

	document.onmousemove = function() {

	if (moveable) {

	var evt = getEvent();

	var x = moveLeft + evt.clientX - moveX; //www.w3cschool.cn w3cschool

	var y = moveTop + evt.clientY - moveY;

	if ( x > 0 &&( x + w < iWidth) && y > 0 && (y + h < iHeight) ) {

	msgObj.style.left = x + "px";

	msgObj.style.top = y + "px";

	}

	}

	};

	document.onmouseup = function () {

	if (moveable) {

	document.onmousemove = docMouseMoveEvent; //www.w3cschool.cn w3cschool

	document.onmouseup = docMouseUpEvent;

	moveable = false;

	moveX = 0;

	moveY = 0;

	moveTop = 0;

	moveLeft = 0;

	}

	};

	} 

	var closeBtn = tr.insertCell(-1);

	closeBtn.style.cssText = "width:1%;cursor:pointer; padding:2px;background-color:" + titlebgcolor;

	closeBtn.innerHTML = "<span style='font-size:15pt; color:"+titlecolor+";'>×</span>";

	closeBtn.onclick = function(){

	document.body.removeChild(bgObj);

	document.body.removeChild(msgObj);

	}

	var msgBox = table.insertRow(-1).insertCell(-1);

	msgBox.style.cssText = "font:10pt '宋体';word-break:break-all;";

	msgBox.colSpan = 2;

	msgBox.innerHTML = msg; 

	// 获得事件Event对象，用于兼容IE和FireFox

	function getEvent() {

	return window.event || arguments.callee.caller.arguments[0];

	}

}

</script>

</head>

<body>

<input type="button" value="w3cschool" onclick="alertWin('演示','我是fffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff',400,200);" />

</body>

</html>

style弹出带滚动条的虚拟窗口的更多相关文章

  1. PHP JS HTML ASP页面跳转代码 延时跳转代码 返回到上一界面并刷新 JS弹出指定大小的新窗口

    1.PHP延时跳转代码 //跳转到浏览界面 header("Refresh:1;url=machine_list.php"); //不延时 <?php header(&quo ...

  2. js制作带有遮罩弹出层实现登录小窗口

    要实现的效果如下 点击“登录”按钮后,弹出登录小窗口,并且有遮罩层(这个名词还是百度知道的,以前只知道效果,却不知道名字) 在没有点击“登录”按钮之前登录小窗口不显示,点击“登录”按钮后小窗口显示,并 ...

  3. 如何禁用MySql总是定时弹出一个MySQLInstallerConsole.exe的窗口

    如何禁用MySql总是定时弹出一个MySQLInstallerConsole.exe的窗口 禁用mysql总是弹出一个安装框的定时任务这一条安装命令,Installing MySQL 5.6.21 u ...

  4. asp.net中的窗口弹出实现，包括分支窗口 . ASP.NET返回上一页面实现方法总结 .

    返回上一页的这个东东在我们做项目的时候一般是用于填写完表单后确认的时候,有对原来输入的数据进行修改或者更新时用的,或者是因为网站为了方便浏览者而有心添加的一个东东,一般这种功能的实现在ASP.NET中 ...

  5. 点击弹出固定大小的新窗口（js实现）

    <SCRIPT LANGUAGE="javascript"> <!-- window.open ('page.html') --> </SCRIPT& ...

  6. JS中的三种弹出式消息提醒(警告窗口、确认窗口、信息输入窗口)的命令是什么？

    一种: <a href="javascript:if(confirm('确实要删除该内容吗?')){location='http://www.google.com'}"> ...

  7. js实现点击按钮弹出上传文件的窗口

    转自:https://www.jb51.net/article/100916.htm 1.详细描述 在页面上设置一个“选择文件”按钮,点击该按钮,会弹出本地磁盘信息用于选择文件. 2.代码 ? 1 2 ...

  8. 点击一个超链接,弹出固定大小的新窗口（js实现）

    1.最基本的弹出窗口代码 <SCRIPT LANGUAGE="javascript"> <!-- window.open ('page.html') --> ...

  9. WPF弹出带蒙板的消息框

    效果图 思路 拿到父级窗体的内容,放入一个容器里,再在容器里放入一个半透明层.将整个容器赋给父级窗体的内容. 关闭时反向操作. 代码 消息窗弹出时 /// <summary> /// 弹出 ...

随机推荐

  1. <%@ include file="">和<jsp:include file="">区别

    <%@include file="a.jsp"%>是在编译时加入,所谓静态,就是在编译的时候将jsp的代码加入进来再编译,之后运行. <jsp:include p ...

  2. HDUOJ --2544最短路（基础）

    输入包括多组数据.每组数据第一行是两个整数N.M(N<=100,M<=10000),N表示成都的大街上有几个路口,标号为1的路口是商店所在地,标号为N的路口是赛场所在地,M则表示在成都有几 ...

  3. 【LeetCode】114. Distinct Subsequences

    Distinct Subsequences Given a string S and a string T, count the number of distinct subsequences of  ...

  4. 分享一款眼睛保健小软件 EyeDefender 多关注下眼睛的健康

    http://www.nowamagic.net/librarys/veda/detail/2248 感觉最近视力又下降了不少,估计又要重新配眼镜了.总是对着电脑一坐就好几个小时,眼睛老是紧绷着,焦距 ...

  5. Java虚拟机学习 - 内存调优 ( 9 )

    JVM调优主要是针对内存管理方面的调优,包括控制各个代的大小,GC策略.由于GC开始垃圾回收时会挂起应用线程,严重影响了性能,调优的目是为了尽量降低GC所导致的应用线程暂停时间. 减少Full GC次 ...

  6. iOS - Bundle 资源文件包

    1.Bundle 文件 Bundle 文件,简单理解,就是资源文件包.我们将许多图片.XIB.文本文件组织在一起,打包成一个 Bundle 文件.方便在其他项目中引用包内的资源. Bundle 文件是 ...

  7. A class file was not written. The project may be inconsistent, if so try refreshing this project and building it. eclipse提示错误

    感觉很奇怪,查看了一下磁盘,发现workspace所在磁盘已经满了,删除一些文件之后,选择项目->Project->Clean...->选择Clean all projects-&g ...

  8. RHEL7 -- 识别文件系统和设备

    逻辑卷依赖于设备映射程序(DM)内核驱动程序. 比如有个逻辑卷组rhel中有一个逻辑卷root,对应的设备为/dev/rhel/root.符号链接/dev/rhel/root指向/dev/dm-< ...

  9. 【驱动笔记10】再谈IRP

    文章作者:grayfox作者主页:http://nokyo.blogbus.com原始出处:http://www.blogbus.com/nokyo-logs/34010655.html 这一节会对I ...

  10. mysql 查询昨天，今天、七天、30天的数据

    主要是时间戳转"1993-01-01 00:00:00"的时间格式,然后和当前时间比对CURDATE() 如果字段本身符合正常时间格式,则直接使用即可 今天的数据 SELECT * ...