HTML页面自动跳转到第三方页面

最新推荐文章于 2024-04-29 11:06:38 发布

冉木

最新推荐文章于 2024-04-29 11:06:38 发布

阅读量8k

点赞数 1

分类专栏： HTML 文章标签： html css html5

本文链接：https://blog.csdn.net/qq_42347616/article/details/99740276

版权

HTML 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

项目需要引用其他公司的页面，于是学习了一下跳转的方法。这里提供两种方法！

第一种:直接跳转
直接写在head中即可！
（这里对meta不了解的可以看我的这篇文章）

<head>
    <meta http-equiv="Content-Language" content="zh-CN">    //设定语言
    <meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=gb2312">  //旧版设定字符集。
   // <meta charset="utf-8">   HTML5的字符集设定，推荐“UTF-8”。这两种二选一。
    <meta http-equiv="refresh" content="0.1;url=//www.baidu.com/">  //设置跳转时间和目标路径。
    <title></title>
</head>

第二中:X秒后跳转

 < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
    <title></title> 
           <style type="text/css">
                #dv{border:4px #E8E8E9 double;margin:auto;width:600px;height:300px;background-color:#E8E8E8;
                /*设置透明度*/
                filter:alpha(opacity=50); -moz-opacity:0.6; -khtml-opacity: 0.6; opacity: 0.6;}
                .top{border:0px #0000FF solid;width:400px;height:40px;margin:auto;margin-top:12px;}
                .top li{border:0px #00FF00 solid;width:180px;height:40px;float:left;list-style:none;text-height:40px;line-height:40px;}
                .top .top_one{width:70px;height:40px;margin-left:80px;}
                .top #setTime{color:#900;width:30px;height:40px;font-size:36px;text-align:center;}
                .bottom{border:0px #0000FF solid;width:400px;height:40px;margin:auto;margin-top:160px;}
                .bottom li{border:0px #00FF00 solid;width:120px;height:40px;float:left;list-style:none;line-height:40px;}
                .bottom .bottom_one{width:100px;height:40px;margin-left:220px;}
                .bottom .bottom_two{width:70px;height:40px;}
                .bottom .bottom_two a:hover{color:#F00;}
                .bottom .bottom_two a{text-decoration:none;color:#0F0;}
           </style>    
</head>
<body bgColor="#f7f7f7">
    <div id = "dv" >
            <ul class="top">
                <li class="top_one">网页将在</li>
                <li id="setTime"></li>
                <li>秒后自动跳转......</li>
            </ul>
            <ul class="bottom">
                <li class="bottom_one">如果未跳转请</li>
                <li class="bottom_two"><a href="http://www.baidu.com">点击此处</a></li>
            </ul>   //此处添加跳转的url
    </div>
   <!--定时器-->
    <script type="text/javascript">
    var i = 1;
    var tId;
    document.getElementById("setTime").innerHTML = i;
    function showTime(){
        if(i == 0){
            window.clearInterval(tId);
            return;
        }
        i--;
        document.getElementById("setTime").innerHTML = i;
        if(i == 0){  //如果时间秒数为0，跳转到指定页面
            location.replace("http://www.baidu.com");  //跳转的url
        }
    }
    window.setInterval(showTime,1000);

	</script>
         <!--保持网页不变形-->
       <script type="text/javascript">
        var a=screen.availWidth;
        var b=screen.availHeight;
        window.moveTo(0,0)
        window.resizeTo(a,b)
	</script>
</body>
</html>

冉木

关注

1
点赞
踩
3

收藏

觉得还不错? 一键收藏
打赏
0
评论
HTML页面自动跳转到第三方页面

项目需要引用其他公司的页面，于是学习了一下跳转的方法。这里提供两种方法！第一种:直接跳转直接写在head中即可！（这里对meta不了解的可以看我的这篇文章：）<head> <meta http-equiv="Content-Language" content="zh-CN"> //设定语言 <meta HTTP-EQUIV="Cont...
复制链接

扫一扫