2011-07-05 74 views
1

現在我必須點擊鏈接打開模態窗口。我不知道如何使這個東西加載,而無需點擊鏈接。任何人都可以告訴我如何做到這一點? 謝謝!模態窗口javascript css疊加

<!DOCTYPE> 
<script type="text/javascript"> 
function overlay() { 
     el = document.getElementById("overlay"); 
     el.style.visibility = (el.style.visibility == "visible") ? "hidden" : "visible"; 
} 
</script> 
<style type="text/css"> 
body { 
    height:100%; 
    margin:0; 
    padding:0; 
} 
#overlay { 
    visibility: hidden; 
    position: absolute; 
    left: 0px; 
    top: 0px; 
    width:100%; 
    height:100%; 
    text-align:center; 
    z-index: 1000; 

     background:black; 
      /* Required for IE 5, 6, 7 */   /* ...or something to trigger hasLayout, like zoom: 1; */   width: 100%;   /* Theoretically for IE 8 & 9 (more valid) */   /* ...but not required as filter works too */   /* should come BEFORE filter */   -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";   /* This works in IE 8 & 9 too */   /* ... but also 5, 6, 7 */   filter: alpha(opacity=90);   /* Older than Firefox 0.9 */   -moz-opacity:0.9;   /* Safari 1.x (pre WebKit!) */   -khtml-opacity: 0.9;   /* Modern!   /* Firefox 0.9+, Safari 2?, Chrome any?   /* Opera 9+, IE 9+ */   opacity: 0.9; 
} 
#overlay div { 
    width:300px; 
    margin: 100px auto; 
    background-color: #fff; 
    border:1px solid #000; 
    padding:15px; 
    text-align:center; 
} 
</style> 
</head> 
<body> 
<div id="overlay"> 
    <div> 
      <p>Content you want the user to see goes here.</p> 
      Click here to [<a href='#' onclick='overlay()'>close</a>] 
    </div> 
</div> 

<p><a href='#' onclick='overlay()'>Click here to show the overlay</a> 
</p> 
</body> 
</html> 

回答

1

如果你想將它負載然後改變你的身體標記是這樣的:

<body onLoad="overlay()"> 

現在對話框將盡快在頁面加載顯示。


如何讓這件事情裝載 ,而無需點擊鏈接

在哪種方式你想要什麼?在鼠標懸停?負載?更加詳細一些。