您的位置：首页 > Web前端 > CSS

记录下遮罩的方法 css不同浏览器下的透明设计

2007-12-08 01:28 295 查看

#TB_overlay{...}{

position:absolute;

z-index:10100!important;

top:0px;

left:0px;

background-color:#FFFFE1;;

width:100%;

display:none;

height:1600px;

filter:alpha(opacity=60);

-moz-opacity:0.6;

opacity:0.6;

}

#TB_window{...}{

background:#FFFFFFnonerepeatscroll0%;

border:1pxsolid#445566;

color:#000000;

display:none;

left:400px;

position:absolute;

text-align:left;

top:200px;

z-index:10102!important;

background-color:#FFFFE1;

}

这段css是从同事做的一个页面上烤下来的，主要有2个地方：

1，不同浏览器的透明度设置不同：

filter:alpha(opacity=60);
-moz-opacity:0.6;
opacity:0.6;

2，当原页面上有flash存在的时候要注意

<divid="flash"style="z-index:0"><object....[code]wmode="transparent"

></div>[/code]

基本上这两点做到后就可以实现遮罩效果了如果希望弹出地窗口可以自动drag&drop

可以使用jquery的plugin[code]jquery.easydrag.js

$("#dragid").easydrag();

但是其后碰到一个问题是：如果这个新开的窗口里面含有form表单，有text元素，可能会出现鼠标左击无效的情况，这是在firefox

下发生的ie完全正常，后来在同事的帮助下，我的解决办法onclick="this.select()",但是并不是最好的解决办法

还会出现其他的小问题。。。。

jquery确实不错啥时候也能写个这么人见人爱人会用的东西呢？赫赫

[/code]

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航

记录下遮罩的方法 css不同浏览器下的 透明 设计

记录下遮罩的方法 css不同浏览器下的透明设计