如何控制DIV不会超出屏幕？？？

如何控制DIV不会超出屏幕？？？ 当鼠标点击后弹出一个小图片，用DIV显示出一张大图片，但是大图的DIV不能完全的和鼠标定位，有时还会超出 浏览器，如何解决这问题呀 这是页面地址  http://www.bbsylm.cn/xcdg/new/diploma.html JS代码: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>dong gaun xing chang </title> 
<script src="Scripts/swffix_modified.js" type="text/javascript"> </script> 
</head> 
<link href="css.css"  rel="stylesheet" /> <script> 
var t=1 
var rid 
function showBigPic(picurl) 
{ 
if(picurl!="") 
{ 
//alert(picurl); var picurl=" <img src="+picurl+">" 
var bigPic =document.getElementById("bigPic") 
bigPic.filters.alpha.opacity=0 
rid = setInterval("showpic(rid)",100) 
bigPic.style.display="block" 
bigPic.innerHTML=picurl 
bigPic.style.pixelLeft=event.clientY; 
bigPic.style.pixelTop =event.clientX; 
} 
} 
function showpic(rid) 
{ 
document.getElementById("bigPic").filters.alpha.opacity=t*10 
t=t+1; 
if(t==10) 
{ 
clearInterval(rid) 
t=1; 
} 
} 
function clsBigPic(obj) 
{ 
//var bigPic =document.getElementById("bigPic") 
obj.style.display="none" 
} 
</script> 
<body> 
<div id="contaner"> 
  <div id="flash"> 
    <object id="FlashID" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="683" height="377"> 
      <param name="movie" value="Flash/header.swf" /> 
      <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. --> 
      <!--[if !IE]>--> 
      <object type="application/x-shockwave-flash" data="Flash/header.swf" width="683" height="377"> 
        <!-- <![endif]--> 
        <param name="quality" value="high" /> 
        <param name="wmode" value="opaque" /> 
        <param name="swfversion" value="6.0.65.0" /> 
        <!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. --> 
        <param name="expressinstall" value="Scripts/expressInstall.swf" /> 
        <!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. --> 
        <div> 
          <h4>Content on this page requires a newer version of Adobe Flash Player. </h4> 
          <p> <a href="http://www.adobe.com/go/getflashplayer"> <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" width="112" height="33" /> </a> </p> 
        </div> 
        <!--[if !IE]>--> 
      </object> 
      <!-- <![endif]--> 
    </object> 
  </div> 
  <div id="indexbody"> 
        <div id="indexleft"> 
          <ul> 
            <li> <a href="index.html">&nbsp;&nbsp;&nbsp; Home </a> </li> 
            <li> <a href="aboutus.html">&nbsp;&nbsp;&nbsp; About Us </a> </li> 
            <li> <a href="products.html">&nbsp;&nbsp;&nbsp; Products </a> </li> 
            <li> <a href="News.html">&nbsp;&nbsp;&nbsp; News Center </a> </li> 
            <li> <a href="diploma.html">&nbsp;&nbsp;&nbsp; Honor </a> </li> 
            <li> <a href="office.html">&nbsp;&nbsp;&nbsp; Office </a> </li> 
            <li> <a href="contact.html">&nbsp;&nbsp;&nbsp; Contact </a> </li> 
          </ul> 
        </div> 
        
        <div id="licesright"> 
        <h1> </h1> 
            <ul>  
                <li> <img src="zs/3x.jpg"  onclick="showBigPic('zs/3d.jpg')"> </li> 
                <li> <img src="zs/4x.jpg"  onclick="showBigPic('zs/4d.jpg')"> </li> 
          </ul> 
          
            <ul> 
                <li> <img src="zs/1x.jpg" onclick="showBigPic('zs/1d.jpg')"> </li> 
                <li> <img src="zs/2x.jpg" onclick="showBigPic('zs/2d.jpg')"> </li> 
            </ul> 
          <ul> 
                <li> <img src="zs/5x.jpg" onclick="showBigPic('zs/5d.jpg')" > </li> 
                <li> <img src="zs/6x.jpg" onclick="showBigPic('zs/6d.jpg')"> </li> 
            </ul> 
        </div> 
  </div> 
  <div id="footer"> 
            <ul> 
            <li> <a href="index.html"> Home </a> </li> 
            <li> <a href="aboutus.html"> About Us </a> </li> 
            <li> <a href="News.html"> News Center </a> </li> 
            <li> <a href="products.html"> Products </a> </li> 
            <li> <a href="diploma.html"> Honor </a> </li> 
            <li> <a href="office.html"> Office </a> </li> 
            <li> <a href="contact.html"> Contact </a> </li> 
          </ul> 
  </div> 
  <div id="bigPic" onclick="clsBigPic(this)"> </div> 
  <div id="copyright">Copyright 2009 &copy; xingchang plastic manufactory. Privacy Policy </div> 
</div> 
<script type="text/javascript"> 
<!-- 
SWFFix.registerObject("FlashID"); 
//--> 
</script> 
</body> 
</html> 

解决方案 »

  1.   

    <style type="text/css">
    <!--
    .STYLE1 {font-size: 12px}
      
    html,body{   
    height: 100%;   
    width: 100%;   
    margin:0px;   
    padding:0px;   
    }   
    #ceng {   
     background-color: #D0D3DB;   
     height: 100%;   
     width: 100%;   
     z-index: 1;   
     left: 0px;   
     top: 0px;   
     right: 0px;   
     bottom: 0px;   
     filter: Alpha(Opacity=60);   
     position: absolute;   
     display:none;
    }   
      
    -->
    </style><div id="ceng" >
    </div>