我做了一个弹出层,点击的时候设为display:block就展示了,关掉的时候设为display:none。 可以关掉
但是那块区域后面的东西没法选了,改怎么办?
就是虽然内容部显示了,但实际上那个地方还在占着
就是隐藏了一样
代码如下:
js代码:
  function show(el) { 
var element = $(el)[0];
element.style.display = 'block';
element.style.color = '#FF0000';
element.style.zIndex = '999';

function close_box(obj){
obj.parentNode.style.display = 'none';
obj.parentNode.style.zIndex = '-999';
}function floatBox(posEL,element){ 
var posX,posY,pos,offTop; 
var width = 300;
var width1 = 630; 
var height = 280; 
if(isIE){ 
pos = $(posEL)[0]//.childNodes[0]; 
offTop = -200; 
}else{ 
pos = $(posEL)[0];
offTop = -210; 
}
posX = Math.abs(pos.offsetLeft-width1); 
posY = Math.abs(pos.offsetTop-offTop); 
var box = $("#pop_window")[0]; 
    box.style.position = 'absolute';  
    box.style.zIndex = 999; 
    box.style.top = posY + 'px';    
    box.style.left = posX + 'px';    
    box.style.width = width + 'px';    
    box.style.height = height + 'px'; 
var str ="<div class='png'><img onclick='close_box(this)' src='images/close.gif' class='hand' title='close' alt='close' id='floatBox_img' style='float:right;' />";
switch (element){
case 'shipping_info':
                     str += shipping_info;
                     break;
        case 'payment_option':
                              str += payment_option;
                              break;
case 'questions':
                              str += questions;
                              break;                              
default : str += content;
          break;

}
str += "</div>";
box.innerHTML = str; 
show('#pop_window'); 
return false;

html代码
<div id="pop_window" style="display:none"></div> 
        <ul class="g_t_c" style="list-style:none;">
          <li style="margin-top: 3px;"><a title="Shipping Methods" onclick="floatBox(this,'payment_option');" href="<?php echo $_SERVER['REQUEST_URI'];?>#"> <?php echo zen_image($template->get_template_dir('shipping.gif', DIR_WS_TEMPLATE, $current_page_base,'images/button'). '/' . 'shipping.gif','Shipping Methods','','',' class="relative"');?></a></li>
          <li style="margin-top: 3px;"><a title="Payment methods" onclick="floatBox(this,'shipping_info');" href="<?php echo $_SERVER['REQUEST_URI'];?>#"> <?php echo zen_image($template->get_template_dir('payment.gif', DIR_WS_TEMPLATE, $current_page_base,'images/button'). '/' . 'payment.gif','Payment Methods','','',' class="relative"');?></a></li>
          <li style="margin-top: 3px;"><?php echo '<a href="javascript:popupWindow(\'' . zen_href_link(FILENAME_POPUP_ASK_A_QUESTION, 'products_id='.$_GET['products_id']) . '\')">'.zen_image($template->get_template_dir('ask.gif', DIR_WS_TEMPLATE, $current_page_base,'images/button'). '/' . 'ask.gif','Ask Questions About This Item','','',' class="relative"').'</a>';?></li>
          <li style="margin-top: 3px;"><?php echo '<a href="'.zen_href_link(FILENAME_TELL_A_FRIEND, 'products_id='.$_GET['products_id']). '">'.zen_image($template->get_template_dir('tell_a_friends.gif', DIR_WS_TEMPLATE, $current_page_base,'images/button'). '/' . 'tell_a_friends.gif','Tell A Friends','','',' class="relative"').'</a>';?></li>
        </ul>已经尝试过加zIndex,但是不行。也或许是我加的不对。
希望各位能够帮忙解决下,先谢谢大家了