JS弹出对话框(可拖动)

最新推荐文章于 2024-08-01 12:56:26 发布

我是黄老邪

最新推荐文章于 2024-08-01 12:56:26 发布

阅读量1.9k

点赞数

分类专栏： Web JavaScript 文章标签： JS

本文链接：https://blog.csdn.net/dezhihuang/article/details/53967272

版权

本文介绍如何使用JavaScript创建一个可拖动的对话框。通过实例代码展示，读者将理解如何实现对话框的动态定位和拖动功能，增强网页交互体验。

摘要由CSDN通过智能技术生成

效果图：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>可拖动的对话框</title> 
<META http-equiv=Content-Type content="text/html; charset=utf-8"> 
<style> 
#popDiv { 
	position: absolute; 
	visibility: hidden; 
	overflow: hidden; 
	border: 2px solid #AEBBCA; 
	background-color: #EEF1F8; 
	cursor: move; 
	padding: 1px; 
	z-index:60001; 
} 

#popTitle { 
	background: #9DACBF; 
	height: 20px; 
	line-height: 20px; 
	padding: 1px; 
} 

#popTable { 
	padding: 6px; 
} 

.title_left { 
	font-weight: bold; 
	padding-left: 5px; 
	float: left; 
} 

.title_right { 
	float: right;