`

AJAX弹出提示信息效果

 
阅读更多 
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>提示信息框</title>
<style type="text/css">
a {
	color: #000;
	font-size: 12px;
	text-decoration: none
}

a:hover {
	color: #900;
	text-decoration: underline
}

body {
	background: ;
	filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,
		startColorStr=#ffffff, endColorStr=#003366 );
	overflow: hidden
}

#massage_box {
	position: absolute;
	left: expression(( body.clientWidth-350)/2 );
	top: expression(( body.clientHeight-200)/2 );
	width: 350px;
	height: 200px;
	filter: dropshadow(color = #666666, offx = 3, offy = 3, positive = 2);
	z-index: 2;
	visibility: hidden
}

#mask {
	position: absolute;
	top: 0;
	left: 0;
	width: expression(body.scrollWidth);
	height: expression(body.scrollHeight);
	background: #666;
	filter: ALPHA(opacity = 60);
	z-index: 1;
	visibility: hidden
}

.massage {
	border: #036 solid;
	border-width: 1 1 3 1;
	width: 95%;
	height: 95%;
	background: #fff;
	color: #036;
	font-size: 12px;
	line-height: 150%
}

.header {
	background: #036;
	height: 10%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding: 3 5 0 5;
	color: #fff
}
</style>
<!--实现层移动-->
<script language="javascript">
	var Obj = ''
	document.onmouseup = MUp
	document.onmousemove = MMove

	function MDown(Object) {
		Obj = Object.id
		document.all(Obj).setCapture()
		pX = event.x - document.all(Obj).style.pixelLeft;
		pY = event.y - document.all(Obj).style.pixelTop;
	}

	function MMove() {
		if (Obj != '') {
			document.all(Obj).style.left = event.x - pX;
			document.all(Obj).style.top = event.y - pY;
		}
	}

	function MUp() {
		if (Obj != '') {
			document.all(Obj).releaseCapture();
			Obj = '';
		}
	}
</script>
</head>
<body>
	<div id="massage_box">
		<div class="massage">
			<div class="header" onmousedown=MDown(massage_box)>
				<div style="display: inline; width: 150px; position: absolute">本站提示信息</div>
				<span
					onClick="massage_box.style.visibility='hidden'; mask.style.visibility='hidden'"
					style="float: right; display: inline; cursor: hand">×</span>
			</div>
			<ul style="margin-right: 25">
				<li>本人申明此博客所有文章（包括文章插图）均为原创，如需引用或转载请注明出处。</li>
				<li>欢迎大家对博文中观点留言评述，谢绝无聊人士无素质无观点的灌水漫骂。</li>
				<li>本站已设背景音乐，听音乐盒中收集的音乐时请先到页面底部关闭背景音乐。</li>
			</ul>
		</div>
	</div>
	<div id="mask"></div>
	<span
		onClick="mask.style.visibility='visible';massage_box.style.visibility='visible'"
		style="cursor: hand"><a href="#">显示提示信息</a></span>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
	<br>
</body>
</html>
分享到：
| JS不间断向左滚动
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    AJAX弹出提示信息效果特效代码

    标题 "AJAX弹出提示信息效果特效代码" 涉及到的是网页开发中的动态交互技术，特别是使用AJAX（Asynchronous JavaScript and XML）来实现的。AJAX 是一种在无需刷新整个页面的情况下，能够更新部分网页内容的技术，极...

    Ajax弹出框效果（背景全黑）

    在网页设计和开发中，Ajax 弹出框是一种常见...总的来说，掌握Ajax弹出框的制作涉及前端开发的多个方面，包括JavaScript编程、DOM操作、CSS样式设计以及异步编程。这个项目可以作为一个学习和实践这些技能的优秀实例。

    ajax 弹出信息框（取数据库资源）及登陆

    在标题中提到的"ajax 弹出信息框"，通常是指在用户触发某个操作后，通过Ajax获取服务器返回的信息，然后在页面上动态创建或更新一个弹出框来显示这些信息。这涉及到DOM操作，比如使用JavaScript的`document....

    让AJAX弹出提示信息效果的代码

    - **`&lt;div id="massage_box"&gt;`** 是一个具有特定ID的`div`容器，用于显示提示信息。 - **`.header`** 和 **`.massage`** 类用于进一步细分和样式化提示信息框的头部和主体内容。 #### CSS部分： - **`position: ...

    Ajax弹出提示框源码示例

    本示例中的"Ajax弹出提示框源码"展示了一个功能完善的弹窗系统，其中包括了Ajax技术、提示框效果、页面禁用以及拖拽功能。 首先，让我们来了解一下Ajax（Asynchronous JavaScript and XML）的核心概念。Ajax并非一...

    AJAX下调出弹出框

    弹出框在网页设计中通常用于显示额外的信息或收集用户输入，如确认操作、显示警告或提示等。在AJAX调用中使用弹出框，可以通过JavaScript动态创建和控制弹出框的显示与隐藏。常见的弹出框实现方式包括模态对话框...

    Ajax弹出提示.rar

    在"Ajax弹出提示.rar"这个压缩包中，包含了实现Ajax弹出提示功能的相关文件，让我们逐一解析这些文件的作用。 1. `testAjax.html`：这是一个HTML文件，通常用作前端展示页面。在Ajax应用中，它会包含一个或多个与...

    Ajax实现弹出层...

    在实际开发中，为了提高代码复用性和可维护性，我们通常会封装这些功能成一个通用的Ajax弹出层组件，允许传入不同的参数，如请求URL、数据、回调函数等。 文件“Messaging”可能与这个话题有关，因为弹出层在消息...

    Ajax弹出漂亮可拖动的提示层(窗)效

    【Ajax弹出漂亮可拖动的提示...总结起来，"Ajax弹出漂亮可拖动的提示层(窗)效果"是一种利用Ajax、CSS和JavaScript技术实现的网页交互设计，它可以提供美观、动态且具有交互性的提示信息，提升用户在网页上的操作体验。

    Ajax弹出漂亮可拖动的提示层(窗)效果.rar

    在这个"Ajax弹出漂亮可拖动的提示层(窗)效果"中，我们将会探讨如何利用Ajax构建一个既美观又功能丰富的交互式提示层。 首先，提示层通常是网页中用于显示消息、警告或确认信息的元素。在这里，我们将使用Ajax来动态...

    ajax实现弹出窗口代码大全

    本文将详细解析如何利用AJAX技术实现各种弹出窗口效果，帮助开发者更好地理解和应用这些技巧。 #### 基本原理：`window.open`方法 在HTML和JavaScript中，`window.open()`方法是最常用的创建新窗口或弹出窗口的...

    Ajax右下角弹出窗口

    Ajax右下角弹出窗口是一种常见的用户交互设计，它利用Ajax技术实现在不刷新整个页面的情况下，于页面右下角动态展示信息或提示。这种设计不仅提升了用户体验，还能有效地传递实时数据，使得网页更具交互性和响应性。...

    Ajax登陆弹出提示对话框（附实例）

    **Ajax 登录弹出提示对话框详解** 在Web开发中，提供友好的用户体验至关重要，而Ajax登录弹出提示对话框正是一种实现这一目标的有效方法。它允许用户在不离开当前页面的情况下进行登录操作，增强了交互性和网站的...

    Ajax 提交弹出层源码

    - 如果需要进一步用户交互，比如确认操作，弹出层可以保持打开状态，并显示相应的提示。 通过这种方式，我们可以创建一个动态且具有反馈功能的用户界面，提高了用户体验。在实际开发中，还可以结合jQuery或其他库来...

    AJAX弹出框_利用ScriptManager.RegisterStartupScript

    使用 `ScriptManager.RegisterStartupScript` 实现 AJAX 弹出框 #### 概念理解 - **`ScriptManager.RegisterStartupScript`** 是 ASP.NET AJAX 控件工具包中的一个方法，用于在服务器端注册一段 JavaScript 脚本，...

Magicbox
Global site tag (gtag.js) - Google Analytics