404页面 3秒后跳到首页 实现

简介: 当我们访问一个页面不存在的时候,就会跳到404页面 一般网站都在在404页面中做一个处理, 就是当用户3秒种内还没有任何操作的话,就会自动跳转到其它页面 技术实现有两种方法 1. 在404页面中的header间加上 2.

当我们访问一个页面不存在的时候,就会跳到404页面

一般网站都在在404页面中做一个处理,

就是当用户3秒种内还没有任何操作的话,就会自动跳转到其它页面

技术实现有两种方法

1. 在404页面中的header间加上

<meta http-equiv=”refresh” content=”3;url=http://你跳转的网站”>

2. 用户JS实现location

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<title>404 Not Found</title>
</head>
<body>
 <h1>找不到指定的页面</h1>
 <span id="totalSecond">3</span>秒后自动返回
</body>
<script language="javascript" type="text/javascript">
<!--
    var second = document.getElementById('totalSecond').textContent;
    if (navigator.appName.indexOf("Explorer") > -1)  //判断是IE浏览器还是Firefox浏览器,采用相应措施取得秒数
    {
        second = document.getElementById('totalSecond').innerText;
    } else
    {
        second = document.getElementById('totalSecond').textContent;
    }
    setInterval("redirect()", 1000);  //每1秒钟调用redirect()方法一次
    function redirect()
    {
        if (second < 0)
        {
            location.href = 'http://要跳转的网站';
        } else
        {
            if (navigator.appName.indexOf("Explorer") > -1)
            {
                document.getElementById('totalSecond').innerText = second--;
            } else
            {
                document.getElementById('totalSecond').textContent = second--;
            }
        }
    }
-->
</script>
</html>
相关文章
|
8月前
页面405是什么原因
页面405是什么原因
712 0
|
6月前
|
存储 前端开发 JavaScript
ElementUI之首页导航与左侧菜单
ElementUI之首页导航与左侧菜单
44 0
|
1天前
首页功能的实现
首页功能的实现。
4 1
|
2月前
404页面自动跳转源码
404页面自动跳转源码
92 10
|
4月前
|
JSON 前端开发 测试技术
ElementUI之首页导航+左侧菜单
ElementUI之首页导航+左侧菜单
40 0
|
5月前
|
前端开发
关于ElementUI之首页导航与左侧菜单实现
关于ElementUI之首页导航与左侧菜单实现
60 0
|
人工智能 大数据 定位技术
实现首页
在互联网红海式的竞争中有90%的客户会停留在首页上。这样首页对于我们在客户心中的就占据这非常重要的地位。为了留住用户,并且让用户真正的留在我们的服务上持续活跃。只有为用户访问服务提供很好的体验,提供吸引客户的内容才能真正的留住客户。所以实现首页就成为互联网服务的核心的难点。
95 0
|
前端开发 JavaScript 开发者
首页-baseCSS
快速学习 首页-baseCSS |学习笔记
140 0
|
前端开发 开发者
首页-轮播图 |学习笔记
快速学习 首页-轮播图
65 0
首页-轮播图  |学习笔记
|
前端开发 开发者
首页—轮播图 |学习笔记
快速学习 首页—轮播图
111 0

热门文章

最新文章