[查看演示] 源码如下
----------------------------------------------------------
<html>
<head>
<title>链接Loading效果...－www.51windows.Net</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<body>
<div id=waiting style="position:absolute;z-index:1;display:none;border: 2 outset #F2F2F2">
<table border="0" cellpadding="0" cellspacing="0" width="360" style="background-color: #D6D3CE; font-size: 12px;">
<tr>
<td width="358" style="background-color: #000080; color: #FFFFFF; padding: 2">请稍候...</td>
</tr>
<tr>
<td width="358" align="center"><img src="http://www.danasoft.com/sig/haiwa.jpg"></td>
</tr>
<tr>
<td width="358" height="20" style="padding: 2;word-break:break-all;" id="linktext"></td>
</tr>
<tr>
<td width="358" height="10" style="padding: 0;border: 1 inset #F2F2F2"><img src="" width=1 height=10 name=sbar style=background-color:#000080></td>
</tr>
</table>
</div>
<SCRIPT LANGUAGE="JavaScript">
document.all.waiting.style.pixelTop = (document.body.offsetHeight - 120) / 2 + document.body.scrollTop;
document.all.waiting.style.pixelLeft = (document.body.offsetWidth - 360) / 2 + document.body.scrollLeft;
function link()
{
o=event.srcElement
while(o.tagName != "A")
{
if(!o.parentElement) return
o=o.parentElement
}
event.returnValue = false
document.all.linktext.innerHTML = "正在打开：<u>"+o.href+"</u>"
document.all.waiting.style.display="";
times = setInterval('showloading();',100);
}
document.onmousedown=link;
function showloading()
{
if (document.sbar.width>356)
{
document.sbar.width=1
//clearInterval(times)
}
else
{
document.sbar.width += 2;
}
}
</script>
点一下链接;会出来了个进度条，只是一个例子，不会进入链接，因为在链接上加了onclick="return false"<br>
<A HREF="http://www.51windows.Net" onclick="return false">http://www.51windows.Net</A>
</body>
</html>
<div style="position: absolute; top: 10; right: 10; width: 148; height: 18;cursor:hand">
<input type="button" name="Button" value="查看源代码" onClick= 'window.location = "view-source:" + window.location.href'></div> |
