`
dingjun1
  • 浏览: 213667 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

创建带遮罩层的提示框

 
阅读更多
function showmsg(t_errmess){
    	var sl = document.body.scrollLeft;
	var sh = document.body.scrollTop;
	var ow = document.body.offsetWidth;
	var oh = document.body.offsetHeight;
	try{
		//alert("sl:"+sl+",sh:"+sh+",ow:"+ow+",oh:"+oh);
		var errDiv=document.getElementById("lay_err123");
		if(errDiv==null || typeof(errDiv)=="undefined"){
			errDiv = document.createElement("div");
			errDiv.id="lay_err123";
			if(ow>350){
				errDiv.style.width="300px";
				errDiv.style.left= (sl+ow/2-100)+"px";
			}else{
				errDiv.style.width="80%";
				errDiv.style.left="8%";
			}
			errDiv.style.position = "absolute";
			errDiv.style.top=(sh+oh/4)+"px";
			errDiv.style.backgroundColor="#99ccff";
			errDiv.style.border="2px solid #3399ff";
			errDiv.style.zIndex=200;
			errDiv.style.textAlign="left";
			document.body.appendChild(errDiv);
		}
		
		var lay1 = document.getElementById("lay1_error");
		if(lay1==null || typeof(lay1)=="undefined"){
			lay1 = document.createElement("iframe");
			lay1.id="lay1_error";
			lay1.style.width = ow+"px";
			lay1.style.height = oh+"px";
			lay1.style.position = "absolute";
			lay1.style.left = sl+"px";
			lay1.style.top = sh+"px";
			lay1.style.backgroundColor="#99ccff";
			lay1.style.zIndex=1;
			lay1.style.filter = "alpha(opacity=50)";
			
			document.body.appendChild(lay1);
		}
		
		
		var str="<div style=\"float:right;clear:both;cursor:hand;color:red;width:30px;\" "
				+"onclick=\"document.getElementById('lay_err123').style.display='none';document.getElementById('lay1_error').style.display='none';\">[关闭]</div><br>";
		errDiv.innerHTML=str+t_errmess;
		errDiv.style.display="";
		lay1.style.display="";
		
	}catch(e){
		//alert(e.description);
	}

}
分享到:
评论

相关推荐

    各种功能的弹出窗口 带遮罩层/不带带遮罩层

    在实际应用中,"带遮罩层的普通窗口"和"不带遮罩层"的选择主要取决于应用场景。例如,如果弹出窗口包含重要操作或需要用户专注的内容,那么使用遮罩层会更为合适。反之,对于非关键性的提示或信息展示,可能不需要...

    winform实现遮罩层效果

    1. 创建遮罩层Form: - 新建一个继承自`System.Windows.Forms.Form`的类,例如命名为`MaskLayerForm`。 - 在构造函数中设置必要的属性,如`Opacity`(透明度)、`BackGroundColor`(背景颜色,通常为黑色)、`...

    微信小程序开发 遮罩层弹出框

    在创建遮罩层和弹出框时,我们将主要涉及 WXML 和 WXSS 的使用。 1. **创建组件结构**: - 在`pages`目录下创建一个新的文件夹,例如`mask_popup`,并在其中创建`index.wxml`和`index.wxss`文件。 - 在`index....

    javascript遮罩层的弹出框

    总的来说,JavaScript遮罩层弹出框是网页交互设计中的一个重要组成部分,它结合了JavaScript的动态性和CSS的视觉表现力,为用户提供了一种有效且灵活的信息提示和交互方式。通过学习和应用这个1.8.2版本的解决方案,...

    CSS3 实现Loading加载,页面遮罩层的应用

    在CSS中,我们可以通过以下方式创建遮罩层: 1. **创建HTML结构**:同样,首先需要一个容器元素,可以是全屏的`&lt;div&gt;`。 2. **设置样式**:为遮罩层设置固定宽度和高度,通常是`100%`,并设置`position`为`fixed`,...

    遮罩层层效果 可用于弹出窗口,提示信息,确认提示框或提交数据进行表单验证和图片遮罩等

    对于提示信息和确认提示框,遮罩层同样发挥着重要作用。例如,在用户提交表单前,系统可能会弹出一个确认框,提醒用户检查信息或确认操作。此时,遮罩层可以防止用户在未做出决定前进行其他操作,确保了信息的准确性...

    JS遮罩层 提示层

    "JS遮罩层 提示层"这个标题所提及的是利用JavaScript技术实现的一种网页交互功能,即在用户界面上创建一个遮罩层或者提示层,通常用于显示重要的消息、警告、选项选择或进行某种操作前的确认。 遮罩层是一种半透明...

    在iframe 中页面中设置遮罩遮罩层

    在网页设计中,有时我们需要在页面中添加一个遮罩层,以实现如加载动画、弹窗提示或隐藏部分内容的效果。本话题将详细讲解如何在iframe中实现页面的遮罩层功能,结合`right.html`, `main.html`, `left.html`, `top....

    html弹出框+遮罩层

    利用CSS3的`transition`和`animation`属性,我们可以添加动态效果,如淡入淡出、滑动等,使弹出框和遮罩层的出现更加吸引人。 6. 响应式设计: 在现代网页设计中,弹出框和遮罩层应具有响应式布局,以适应不同...

    自定义半透明遮罩层

    在网页设计和开发中,自定义半透明遮罩层是一种常见的视觉效果,它通常用于创建交互式的用户体验,比如加载提示、弹出窗口或模态框背景。遮罩层可以覆盖整个页面或者特定区域,通过半透明黑色或灰色背景,使用户聚焦...

    遮罩层,动态的层显示

    在这个过程中,"关闭"标签提示我们可以添加一个关闭功能,让用户能够随时取消遮罩层,这通常是一个小的关闭按钮或者点击遮罩层本身来关闭。在JavaScript中,我们可以监听遮罩层上的点击事件,当用户点击时关闭遮罩层...

    遮罩层.zip

    在网页设计中,遮罩层(Mask Layer)是一种常见的交互元素,用于在用户与页面其他部分交互时提供一种半透明或全透明的覆盖效果。它通常用于显示弹出窗口、加载提示、模态对话框或者突出显示特定内容。在这个名为...

    JQUERY遮罩层效果

    jQuery是一款强大的JavaScript库,它简化了DOM操作、事件处理和动画效果,使得创建遮罩层变得简单易行。本篇将详细介绍如何利用jQuery实现遮罩层效果,并探讨相关技术细节。 首先,我们需要引入jQuery库。在HTML...

    漂亮的遮罩层v1.4.3

    这种遮罩层可以是全屏的,也可以是部分区域的,常用于加载动画、模态框、提示信息或者在用户进行交互时提供视觉焦点。 标题"漂亮的遮罩层v1.4.3"暗示这是一个更新到第1.4.3版本的软件组件或库,专门用于创建美观的...

    微信小程序--遮罩层

    1. 弹窗提示:在用户操作后,如提交表单或点击按钮时,可以弹出一个带有遮罩层的提示框,防止用户在提示信息显示期间进行其他操作。 2. 加载动画:当页面数据正在加载时,遮罩层可以提供反馈,告知用户应用正在进行...

    HTML遮罩层实现源码

    HTML遮罩层是一种常见的网页设计元素,用于在页面上创建半透明或全透明的覆盖层,通常用于显示警告、提示信息、加载动画等,以防止用户在特定操作完成之前与页面其他部分交互。本示例提供了HTML、JavaScript(JS)和...

    lhgdialog弹出层,遮罩层效果源码示例

    "lhgdialog"是一个JavaScript库,专为创建各种类型的弹出层效果而设计,其中包括带或不带遮罩层的窗口,以及具有返回值功能、定位弹出窗口和随滚动条滚动等功能。下面我们将详细探讨这些知识点。 1. 弹出层(Pop-up...

    JavaScrip遮罩层

    为了创建遮罩层,我们需要定义一个CSS类,这个类将应用于我们的div元素。类名可能是`mask`或`overlay`。CSS规则可能包括以下内容: ```css .mask { position: fixed; top: 0; left: 0; width: 100%; height: ...

    注册时候遮罩层的应用

    遮罩层,也称为蒙层或浮层,是一种常见的前端设计技术,用于在页面上创建半透明或全透明的覆盖层,以突出显示特定内容,如弹出窗口、登录框或其他重要操作。 遮罩层在注册过程中的应用主要体现在以下几个方面: 1....

    遮罩层方法(jquery)

    在创建遮罩层时,jQuery可以帮助我们更便捷地操作DOM元素,实现动态效果。 1. **创建遮罩层** 创建遮罩层通常需要两个主要步骤:添加遮罩层元素到DOM和设置样式。在jQuery中,可以使用`$('&lt;div&gt;')`创建一个新的div...

Global site tag (gtag.js) - Google Analytics