0


用JavaScript简单的实现带计时器的页面自动跳转

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档

文章目录


前言

用JavaScript实现页面的自动跳转


一、效果图

请添加图片描述

二、使用步骤

1.HTML代码

代码如下(示例):

<divclass="box4"></div>

这个div需要写在html中

2.CSS代码

代码如下(示例):

.box4{text-align: center;line-height: 0.4rem;font-size: 0.15rem;position: absolute;top: 0.5rem;right: 0.3rem;width: 0.4rem;height: 0.4rem;border: #666666 0.01rem solid;border-radius: 0.2rem;}

这个主要就是设计一下这个计时器的样式,以及计时器在HTML页面的位置。

3.JavaScript代码

<script type="text/javascript">var div = document.querySelector('.box4')//括号中写你div的类名var time =3;//这个位置写跳转时间setInterval(function(){if(time==0){
                location.href ="登录注册.html";//双引号中写你需要跳转到的页面}else{
                div.innerHTML = time +'S';//单引号中是倒计时3、2、1后边加的样式  详见效果图
                time--;}},1000);</script>

总结

以上就是今天要讲的内容,本文仅仅简单介绍了怎么利用JavaScript去做一个计时器进行自动的页面跳转。

标签: javascript html css3

本文转载自: https://blog.csdn.net/weixin_45719052/article/details/125169795
版权归原作者 维妳小熊 所有, 如有侵权,请联系我们删除。

“用JavaScript简单的实现带计时器的页面自动跳转”的评论:

还没有评论