DIVマスク効果
1754 ワード
document.observe('dom:loaded', function(){
$('panel_edit').observe('click', function(event){
shadow_show(this.getAttribute('name'));
});
$('exit').observe('click', function(event){
hide_all(this.getAttribute('name'));
});
});
function shadow_show(panel_id){
if ($('shadow')) {
$('shadow').style.display = 'block';
$(panel_id).style.display = 'block';
}
else {
var body = document.body;
var shadow = new Element('div', {
id: 'shadow'
});
var width = body.offsetWidth + "px";
var height = body.offsetHeight + "px";
shadow.setStyle({
width: eval('width'),
height: eval('height'),
backgroundColor: '#121212',
top: 0,
left: 0,
position: 'absolute',
zIndex: 100,
minHeight: '768px',
opacity: '0.4',
});
$(panel_id).style.display = 'block';
body.appendChild(shadow);
}
}
function hide_all(panel_id){
var j = jQuery.noConflict();
$('shadow').hide();
$(panel_id).hide();
}
自分で书いたマスクの効果は、残念ながら后ですべてJQUERYのプラグインを使うことにしました~これを置いてから改善します..
久しぶりにこれを动かして振り返るのが面倒くさいのは実は2阶建てで1つのマスクを建てて1つの表示のZ-INDEXがマスクの上に书いてあるCSSの中に置くべきものが多すぎてJSの中に入れました.