您当前的位置是:首页-HTML教程

实现网页自动跳转代码html的两种方案

【发表于】:2011/2/27 12:32:00  已被访问:165次

通常HTML文件需要浏览者来选择浏览的内容,如果想自动更换显示的内容一般要用到Javascript、JAVA或CGI等方法来完成。 
现在可以用META实现自动更换显示内容,更换的时间和文件都可以自行设定。语句如下: 


程序代码:
< HEAD> 
<TITLE>刷新内容</TITLE> 
<META HTTP-EQUIV="REFRESH" CONTENT="x; URL=*.*"> 
</HEAD> 

其中,x 是刷新的时间,单位是秒。*.* 是刷新的文件。 

利用<META>标签实现Web的自动跳转。 
在Web上显示一段欢迎信息,隔一定秒数后,自动跳转到其他的Web页 面,由此可以造成新奇的效果。其实现方法是在<HEAD >与</HEAD >标签之间加上如下语句: 

<meta http-equiv="Refresh" content="秒数; url=跳转的文件或地址"> 

如将一个显示欢迎信息的图像:welcome.gif存放在与HTML文档同一个目录中,则下面的HTML文件在浏览器中显示该图像,3 秒钟后将自动跳 

程序代码:
<HTML> 
<HEAD> 
<TITLE>WELCOME</TITLE> 
<meta http-equiv="Refresh" content="3; url=http://www.kuzau.com"> 
</HEAD>
<BODY><img SRC="welcome.gif" ></BODY> 
</HTML>
JS方案
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>正在进入</title>
</head>
<body>
<form name=loading> 
 <p align=center> <font color="#0066ff" size="2">正在进入,请稍等</font><font color="#0066ff" size="2" face="Arial">...</font>
  <input type=text name=chart size=46 style="font-family:Arial; font-weight:bolder; color:#0066ff; background-color:#fef4d9; padding:0px; border-style:none;"> 
  
  <input type=text name=percent size=47 style="color:#0066ff; text-align:center; border-width:medium; border-style:none;"> 
  <script>  
var bar=0  
var line="||"  
var amount="||"  
count()  
function count(){  
bar=bar+2  
amount =amount + line  
document.loading.chart.value=amount  
document.loading.percent.value=bar+"%"  
if (bar<99)  
{setTimeout("count()",100);}  
else  
{window.location = "http://www.kuzau.com";}  
}</script> 
 </p> 
</form> 
<p align="center"> 如果您的浏览器不支持跳转,<a style="text-decoration: none" href="http://www.kuzau.com"><font color="#FF0000">请点这里</font></a>.</p>
</body>
</html>

编辑:汕尾网站建设

 
上下篇: HTML5是近10年来Web标准巨大飞跃 html转义字符

最新推荐信息