最好的叠加方式

The best way to do overlay

本文关键字：方式 叠加      更新时间：2023-09-26
<div id="main">
    <div>TITLE</div>
    <div>BODY</div>
    <div>COMMENT</div>
    <div><textarea></textarea></div>
</div>
<button>overlay</button>
#main {
    width: 200px;
    height: 200px;
    background-color: yellow;
}

生活:http://jsfiddle.net/9DLyE/1/

如何在jQuery中做覆盖的最好方法?如果我点击按钮覆盖，然后我想覆盖(和fancybox一样)所有的div#main，例如background-color: blue和透明度0.5。

使用position:absolute来放置覆盖的div，并使用jquery toggle来显示它

CSS 

#main {
    width: 200px;
    height: 200px;
    background-color: yellow;
    position:relative
}
#overlay{
    background:rgba(0, 84, 214, 0.5);
    height:100%; width:100%;
    position:absolute;
    top:0; left:0;
    display:none
}
jquery 

$('button').click(function(){
    $('#overlay').toggle();
});

你尝试了什么?? ?试着把点击事件像

$('button').on('click',function(){
   //Do your stuff
});

Try this FIDDLE

相关文章：