js簡單的彈層(帶關閉按鈕)

<html>

<head>

//下面紅色的代碼放到css文件中

    #add_value {   
    margin-top:10px;
    display:none;
    z-index:750;
    position:fixed;
    background-color:#fefefe;
    width:600;
    border:1px solid #000;
    }

<script language="javascript" type="text/javascript">

//關閉

window.onload = function ()
  {
    var add_close=document.getElementById("add_close");
    var add_value=document.getElementById("add_value");
    add_close.onclick = function ()
      {
        add_close.style.display = "none";
        add_value.style.display="none";
      };
  };

//彈層

function show() {

//得到該層
  var Idiv = document.getElementById('add_value');

//將該層顯示出來
  Idiv.style.display = "block";

//確定層的位置
  Idiv.style.left = (document.documentElement.clientWidth - Idiv.clientWidth)/2+ "px";
  Idiv.style.top = (document.documentElement.clientHeight - Idiv.clientHeight)/2 + "px";

//設置鼠標的滾輪是否滾動
  document.body.style.overflow = "scroll";
  var oClose = document.getElementById("add_close");
  oClose.style.display = "block";
}

</script>

</head>

<body>

<input type="button" value="彈層" οnclick=show()>

<div id="add_value">

   <table >

//關閉按鈕
        <a href="javascript:" id="add_close" style="float:right">[x]</a>
      </th>
    </table>

</div>

</body>

</html>

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章