`

html+js+css实现遮挡层

 
阅读更多
<style>
#bg{display:none;position:fixed;width:100%;height:100%;background:#000;z-index:2;top:0;left:0;opacity:0.7;}
</style>

<script>
function showMask() {              
    document.getElementById("bg").style.display ="block";  
}  
function hideMask() {  
    document.getElementById("bg").style.display ='none';  
} 
</script>

<body>
<div id="bg"></div> 
</body>
分享到:
评论

相关推荐

    html+css+js实现轮播特效

    在提供的压缩包文件“轮播图”中,可能包含了实现轮播效果的HTML文件、CSS样式表和JavaScript脚本,你可以通过学习这些代码,了解并实践如何将HTML、CSS和JavaScript结合在一起,创造出具有交互性的轮播特效。...

    html+js+css固定表格行列

    本教程将详细讲解如何使用HTML、JavaScript(JS)和CSS来实现这一功能。 首先,我们需要创建一个基本的HTML表格结构。HTML表格由`&lt;table&gt;`元素定义,其内部包含`&lt;tr&gt;`(行)和`&lt;td&gt;`(单元格)元素。若要固定表头,...

    CSS+JS实现DIV蒙板效果

    在网页设计中,CSS(Cascading Style Sheets)和JavaScript(JS)经常被用来实现各种交互效果,其中就包括创建DIV蒙板效果。一个DIV蒙板通常是指在页面上覆盖一层半透明或全黑的层,用于遮挡背景内容,突出显示特定...

    js+div+css弹出层.txt

    根据给定文件的信息,本文将围绕“js+div+css弹出层”的实现方法进行详细介绍。弹出层在网页设计中十分常见,主要用于提供额外的信息展示或者操作界面,如登录框、注册框、提示信息等。 ### 一、基本概念 #### 1.1...

    HTML5+CSS3实现图片可倾斜摆放的动画相册效果源码

    本项目"HTML5+CSS3实现图片可倾斜摆放的动画相册效果源码"就是利用这两者的优势,创造了一种创新的图片展示方式。 首先,HTML5是超文本标记语言的第五个版本,它引入了许多新的元素和API,旨在提高网页的语义性和可...

    JS+CSS兼容的遮罩层

    本教程将详细讲解如何使用JavaScript和CSS实现一个兼容各浏览器的遮罩层。 一、HTML基础布局 首先,我们需要在HTML文档中创建一个用于展示遮罩层的基本结构。可以创建一个`&lt;div&gt;`元素作为遮罩层容器,再创建一个...

    基于Jquery+div+css实现弹出登录窗口(代码超简单)

    本篇文章将介绍如何利用Jquery、Div和CSS技术实现一个简单的弹出登录窗口。在Web开发过程中,实现登录功能是常见需求之一,而弹出式登录窗口可以提供更好的用户体验。下面将详细介绍实现该功能的关键步骤和技术要点...

    CSS+JS实现图片集展示

    在网页设计中,CSS(Cascading Style Sheets)和JavaScript(JS)是不可或缺的两种技术。CSS用于控制页面布局和视觉样式,而JavaScript则赋予网页交互性和动态效果。本话题将详细探讨如何利用CSS和JS实现一个功能...

    jQuery+CSS3实现带毛玻璃效果的模糊背景遮挡特效源码.zip

    在本资源中,"jQuery+CSS3实现带毛玻璃效果的模糊背景遮挡特效源码.zip" 提供了一个使用jQuery和CSS3技术实现毛玻璃效果的遮挡特效。这种效果通常用于增强用户界面的视觉吸引力,使主要内容在半透明、模糊的背景之上...

    HTML+JS网站漂浮物代码

    HTML和JavaScript是构建网页动态效果的关键技术,"HTML+JS网站漂浮物代码"就是将这两者结合起来,实现网页上的浮动元素,如广告、通知、菜单等。这种漂浮物通常会固定在屏幕的一侧或者跟随用户滚动而移动,以吸引...

    CSS+JS图片显示漂亮的漂浮提示框效果.zip

    "CSS+JS图片显示漂亮的漂浮提示框效果"是一个实现这一目标的实例,它结合了CSS(层叠样式表)和JavaScript的技术,为用户提供了一种优雅的方式来展示信息或者提示。这个压缩包文件包含了一个完整的解决方案,用于在...

    jQuery+CSS3实现ToolTip效果.zip

    jQuery是一个强大的JavaScript库,而CSS3是现代网页设计的核心技术之一,提供了丰富的样式和动画功能。 首先,让我们从HTML结构开始。Tooltip通常与特定的HTML元素关联,如`&lt;a&gt;`、`&lt;img&gt;`或自定义的`&lt;div&gt;`。以下是...

    js-css-tooltip是一款使用js和css3制作的tooltip工具提示插件

    1. **引入资源**:首先,需要在HTML文件中引入js-css-tooltip的CSS和JavaScript文件。通常,这些文件位于`mirelvt-js-css-tooltip-192c0bf`压缩包的相应目录下。 2. **HTML结构**:为需要添加Tooltip的元素添加一个...

    移动端简单的带遮挡层的评论功能

    在移动端应用中,评论功能是用户互动的重要组成部分,而实现这样一个功能时,为了提供良好的用户体验,通常会采用遮挡层(overlay)设计。遮挡层评论功能允许用户在不离开当前页面的情况下发表评论,提高交互的流畅...

    jquery+css3实现带预览功能的焦点图代码

    在压缩包中,我们可以找到相关的HTML文件、CSS文件和JavaScript文件,通过分析和调试这些文件,我们可以更深入地理解这个焦点图的实现原理和细节。 总结来说,"jquery+css3实现带预览功能的焦点图代码"是一个结合了...

    css3实现天狗食月特效.zip

    【标签】:“JS特效-css样式”表明这个项目可能不仅限于CSS3,还可能使用了JavaScript来增强交互性或控制动画的某些方面。JavaScript可以用来响应用户交互,如点击或滚动事件,或者根据时间精确地控制动画的进程。...

    使用Javascript实现遮屏效果

    "使用JavaScript实现遮屏效果"这个主题就是关于如何利用JavaScript语言来达到这样的目的。在这个过程中,我们将涉及到DOM操作、CSS样式设置以及事件处理等方面的知识。 首先,了解JavaScript(JS)的基本概念是必要...

    纯css3实现天狗食月日食动画特效.zip

    CSS3的动画功能已经足够强大,可以独立实现这样的动态效果,而无需JavaScript的介入。不过,如果想要增加更多的交互性,例如控制动画的播放、暂停或切换日食月食状态,那么JavaScript将会是一个很好的补充工具,可以...

    jQuery+CSS3实现的全屏垂直翻页特效源码.zip

    标题中的“jQuery+CSS3实现的全屏垂直翻页特效源码”指的是一个利用JavaScript库jQuery和CSS3技术创建的全屏网页垂直翻页效果的代码资源。这种效果常用于制作电子书、产品展示或者创意网页设计,为用户提供一种新颖...

    JS用层实现为图片添加水印效果

    ### JS用层实现为图片添加水印效果 #### 核心知识点解析 本文将详细介绍如何使用JavaScript(简称JS)和HTML结合的方式,在网页中的图片上动态添加水印效果。通过这种方式,可以有效地保护图片版权,增加网站的...

Global site tag (gtag.js) - Google Analytics