`
king_tt
  • 浏览: 2291496 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

网页遮罩层效果 点击按钮网页中间弹出窗口 弹出遮罩层

 
阅读更多
  <style>
.bg{position:absolute;z-index:999;filter:alpha(opacity=50);background:#666;opacity: 0.5;-moz-opacity: 0.5;left:0;top:0;height:99%;width:100%;}
.beian_winBG {
MARGIN-TOP: -100px; LEFT: 50%; MARGIN-LEFT: -190px; WIDTH: 376px; POSITION: absolute; TOP: 50%; HEIGHT:200px;border:#666666 1px solid;z-index: 1000;
}
</style>
<div id="alert_win" style="display:none;">
<div id="mask" style="top:0;left:0;position: absolute;z-index:1000;" class="bg"></div>
<DIV class=beian_winBG id=beian_popup><!--弹出框-->
<div id="divOneStep" style="z-index:1002;width:100%;height:200px;background: #fff;position:absolute;">
<div style="width:100%;background:#f1f1f1;height:30px;light-height:30px;border-bottom:#666666 1px solid;text-align:right;"><a href="javascript:;" onClick="alert_win.style.display='none';">点此关闭</a> </div>
<div>文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容</div>
</div>
<div style="z-index:1001;position:absolute;"><iframe id="frmOneStep" width="100%" height="200" frameborder="0" scrolling="no" src="about:blank"></iframe></div>
</DIV>
</div>
<a href="javascript:;" onClick="alert_win.style.display='block';">显示</a>
<p>中国站长寨提示,无效果请刷新试试。点击上方“显示”页面中间弹出层。JS特效大全在中国站长寨</p>
<p>中国站长寨为中国站长提示精品站长资讯,网页特效,JS特效,网站特效,网站源码,图库素材,站长下载</p>

分享到:
评论

相关推荐

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

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

    jQuery弹出登录遮罩层效果

    "jQuery弹出登录遮罩层效果"是一个常见的交互设计技术,它允许用户在不影响主页面内容的情况下,通过一个半透明的遮罩层弹出登录窗口。这种方法既保证了用户体验,又确保了登录过程的安全性。下面将详细介绍如何实现...

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

    当用户触发某个操作(如点击按钮)时,遮罩层会出现在页面上,覆盖所有可交互的元素,而弹出窗口则在遮罩层之上显示,这样用户只能与弹出窗口交互,直到关闭窗口或完成操作。 对于提示信息和确认提示框,遮罩层同样...

    非常简单的jquery遮罩层鼠标点击按钮放大展开动画弹出框

    首先,jQuery遮罩层(Mask Layer)是一种在网页上覆盖一层半透明黑色背景的技术,通常用于创建弹出框、模态窗口或对话框的效果。它的主要作用是突出显示特定的内容,同时阻止用户与页面其他部分的交互。遮罩层的实现...

    JS简单实现点击按钮或文字显示遮罩层的方法

    本文实例讲述了JS简单实现点击按钮或文字显示遮罩层的方法。分享给大家供大家参考,具体如下: 运行效果图如下: 完整代码如下: &lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"&gt; &lt;...

    jQuery点击遮罩弹出层固定网页中间

    // 弹出遮罩层和弹出层 }); $('#mask, #close').click(function() { $('#mask, #modal').fadeOut(300); // 关闭遮罩层和弹出层 }); // 禁止点击遮罩层时页面滚动 $('#mask').click(function(event) { ...

    js弹出遮罩层效果

    JS弹出遮罩层效果 在Web开发中,弹出遮罩层效果是一个非常常见的交互方式,能够吸引用户的注意,并提供更好的用户体验。本资源提供了一种简单易用的JS弹出遮罩层效果,能够满足大多数项目的需求。 以下是该效果的...

    非常简单,代码非常少的遮罩层点击按钮弹出效果下载

    标题“非常简单,代码非常少的遮罩层点击按钮弹出效果下载”表明我们所讨论的是一个简洁、高效的解决方案,它能够快速地实现这一功能,而且代码量较少,适合初学者和有一定经验的开发者使用。这通常意味着它利用了...

    JavaScript弹出遮罩层

    JavaScript弹出遮罩层是一种常见的前端交互设计,用于在网页上创建一个半透明的覆盖层,通常用于显示警告、提示信息或加载等待效果。在这个场景中,我们看到一个经过修改的遮罩层实现,它可以通过链接触发,并指定弹...

    在一个网页中间弹出窗口

    ### 在网页中间弹出窗口的知识点解析 #### 一、网页弹窗的实现方式与应用场景 在现代网页设计中,弹窗(模态对话框)是一种常见的交互元素,用于显示临时性的信息或提示用户进行某种操作。弹窗的实现不仅能够提升...

    jQuery从下到上弹出遮罩层.rar

    综上所述,"jQuery从下到上弹出遮罩层.rar"的实现主要依赖于CSS来设置遮罩层的样式和动画效果,jQuery负责监听用户交互并控制遮罩层的显示和隐藏。这样的技术组合使得开发者能够轻松创建出丰富的用户界面交互,增强...

    jquery实现点击按钮弹出带有过渡效果的遮罩层窗口动画效果源码.zip

    本资源"jquery实现点击按钮弹出带有过渡效果的遮罩层窗口动画效果源码.zip"提供了使用jQuery创建动态、具有过渡效果的遮罩层窗口的代码示例,这对于构建用户友好的网页界面非常有用。 首先,我们要理解jQuery中的...

    html弹出框+遮罩层

    - `alert()`: 这是最基本的弹出框,用于显示警告信息,用户只能点击“确定”按钮来关闭它。 - `prompt()`: 提供了一个输入框,让用户输入数据,然后返回用户的输入值。 - `confirm()`: 提供一个确认对话框,用户...

    js 弹出窗口 弹出div window 支持遮罩、拖动、嵌入页面、换肤等实用功能

    1. **遮罩效果**:遮罩层是在弹出窗口后面添加一个半透明的背景层,以突出显示弹出窗口并防止用户与页面其他部分互动。实现这一效果通常涉及到CSS的透明度和定位属性,以及JavaScript来动态调整遮罩层的大小和显示。...

    jQuery弹出层插件三种简单遮罩弹出框效果

    弹出层(Popup Layer)是一种常见的网页交互设计,当用户点击按钮或执行特定操作时,会有一个新的窗口或对话框浮现在页面上,展示额外的信息或功能。遮罩弹出框则在此基础上添加了一个半透明的背景层(通常称为...

    弹出遮罩层示例

    标题"弹出遮罩层示例"提示我们这是一个关于如何实现这种效果的教学或实例。下面,我们将深入探讨弹出遮罩层的基本原理、实现方法以及它在实际应用中的作用。 弹出遮罩层的核心在于创建一个覆盖在主页面上的半透明...

    js 弹出遮罩层

    在JavaScript编程中,"弹出遮罩层"是一种常见的用户界面设计手法,它通常用于创建一个半透明的覆盖层,以突出显示特定区域或者暂停其他交互,为用户提供一种聚焦的体验。例如,当我们需要显示模态对话框、加载提示...

    JS弹出遮罩层

    遮罩层点击时会调用`closeModal`,而假设页面中有一个id为`openBtn`的按钮,当点击该按钮时会调用`openModal`。 为了使登录和注册功能更完整,你需要在`modal`元素内添加对应的表单字段,如用户名、密码输入框,...

    C#中防止点击同一按钮多次弹出多个同一窗体办法

    C#,中防止点击同一按钮,多次弹出多个同一窗体,办法 C#,中防止点击同一按钮,多次弹出多个同一窗体,办法 C#,中防止点击同一按钮,多次弹出多个同一窗体,办法 C#,中防止点击同一按钮,多次弹出多个同一窗体,...

Global site tag (gtag.js) - Google Analytics