javascript lightbox效果
一个简单的半透明遮盖层lightbox效果
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<style>
.alpha{position:absolute;z-index:10;left:0px;top:0px;filter:alpha(opacity=50);opacity:.5;background:#000000;}
.infolayer{position:absolute;width:400px;height:300px;background:#ffffff;z-index:1000}
</style>
<script>
window.onload = function () {
var backCompat = document.compatMode == 'BackCompat';
var w = backCompat ? document.body.scrollWidth : document.documentElement.scrollWidth
, h = backCompat ? Math.max(document.body.clientHeight, document.body.scrollHeight) : document.documentElement.scrollHeight;
var div = document.createElement('div');
div.className = 'alpha';
div.id = 'lightbox';
div.style.width = w + 'px';
div.style.height = h + 'px';
document.body.appendChild(div);
div = document.createElement('div');
div.className = 'infolayer';
document.body.appendChild(div);
div.style.top = (h - div.offsetHeight)/2 + 'px';
div.style.left = (w - div.offsetWidth)/2 + 'px';
}
</script>
javascript lightbox效果javascript lightbox效果
加支付宝好友偷能量挖...
原创文章，转载请注明出处：javascript lightbox效果