网页设计代码 img标签可以做遮罩ae蒙版和遮罩吗

来源：蜘蛛抓取(WebSpider) 时间：2016-11-04 15:08 标签： ae蒙版和遮罩区别
先上效果：
添加网格蒙板后（点击放大查看细节）：
这种效果国外的网站用的比较多，，，感觉很好，很精细的感觉。
其实也很简单，就是一个小png覆盖了而已。
源码贴到下面，可以下载。
关键代码：
width:100%;
height:100%;
background:transparent url(images/pattern.png)
z-index:2;
阅读(...) 评论()JS+CSS实现弹出全屏灰黑色透明遮罩效果的方法
投稿：shichen2014
字体：[ ] 类型：转载 时间：
这篇文章主要介绍了JS+CSS实现弹出全屏灰黑色透明遮罩效果的方法,详细分析了弹出遮罩层效果的实现方法以及完整的实例代码,需要的朋友可以参考下
本文实例讲述了js+CSS实现弹出一个全屏灰黑色透明遮罩效果的方法。分享给大家供大家参考。具体分析如下：
在众多的网站都有这样的效果，当进行一定的操作之后，会弹出一个灰黑色的半透明的遮罩，在上面可以操作指定的内容，例如可以弹出一个登陆框之类的内容，下面就介绍一下如何实现此种效果，代码实例如下:
代码如下:&!DOCTYPE html&&&&
&meta charset=" utf-8"&&&&
&meta name="author" content="http://www.jb51.net/" /&&
&title&CSS如何实现弹出一个全屏灰黑色透明遮罩效果-脚本之家&/title&
&style type="text/css"&
&padding:0
&width:100%;
&height:100%;
&background-color:#000;
&filter:alpha(opacity=50);
&-moz-opacity:0.5;
&opacity:0.5;
&position:
&z-index:1000;
&width:280
&height:180
&position:
&left:50%;
&background-color:#000;
&margin-left:-140
&z-index:1500;
&margin-top:50
&line-height:200
&height:200
&text-align:
&script type="text/javascript"&
window.onload=function()
&var zhezhao=document.getElementById("zhezhao");
&var login=document.getElementById("login");
&var bt=document.getElementById("bt");
&var btclose=document.getElementById("btclose");
&bt.onclick=function()
& zhezhao.style.display="block";
& login.style.display="block";
&btclose.onclick=function()
& zhezhao.style.display="none";
& login.style.display="none";&
& &div class="zhezhao" id="zhezhao"&&/div&
& &div class="login" id="login"&&button id="btclose"&点击关闭&/button&&/div&&
& &div class="content"&脚本之家欢迎您，&button id="bt"&点击弹出遮罩&/button&&/div&
以上实现了基本的遮罩功能，当点击弹出遮罩，会弹出一个对象，当点击关闭，遮罩效果消失。下面介绍一下如何实现次效果:
创建一个满屏的div，使用绝对定位，这样的话它就可以脱离文档流，对其他的元素不会产生影响，并且将其设置为半透明状态，当然这个透明度可以随便调的，同时创建一个login元素，它也使用绝对定位，并将其z-index属性值大于面屏的div，这个时候它就不会被满屏div遮盖。在默认状态下这两个div的display属性值是none。当点击相应的按钮可以更改他们的display属性值。
建议:尽可能的手写代码，可以有效的提高学习效率和深度。
希望本文所述对大家的web程序设计有所帮助。
您可能感兴趣的文章:
大家感兴趣的内容
12345678910
最近更新的内容
常用在线小工具输入关键字或相关内容进行搜索
如何在弹出的蒙版 上放 html代码 。详细点谢谢
你可以参考一下hello mui
-& clouddb_wilddog.html这个页面中
popover的展现方式
在回调函数里面返回
就可以添加进去了
但是不能操作添加的元素。mui(&#popover&).popover(&hide&);
var mask=mui.createMask(function () {
$(&.mui-backdrop&).innerHTML=
mask.show();
\n& 查看帮助手册
要回复问题请先或
浏览: 7273
关注: 3 人输入关键字或相关内容进行搜索
var mask = mui.createMask(callback);//callback为用户点击蒙版时自动执行的回调；
mask.show();//显示遮罩
mask.close();//关闭遮罩这行代码是在.js里面写吗？callback是从哪来的值？
callback是你自己需要的回调，要就自己写。不要就空着。
是在js里面，callback就是别人点击遮罩的时候触发的var mask = mui.createMask(callback);//callback为用户点击蒙版时自动执行的回调；
mask.show();//显示遮罩
mask.close();//关闭遮罩
function callback(){
点击遮罩触发这里
要回复问题请先或
浏览: 1680
关注: 3 人

我要回帖

更多关于 ae蒙版和遮罩区别 的文章

 

随机推荐