`
yasuoji120
  • 浏览: 6016 次
  • 性别: Icon_minigender_1
  • 来自: 北京
最近访客 更多访客>>
文章分类
社区版块
存档分类
最新评论

一个带倒计时的JS跳转效果

阅读更多
<html>
<head>
<title></title>
</head>
<body>
<div id="g" style="margin:0px auto; width:800px;">

本页将在<span id="ss"> 3</span>秒后跳转

<a href="http://www.yasuoji120.com">点击链接,进入易迅制冷资讯网</a>
</div>


<script language="JavaScript">


var t = 3;//定义时间
var url = "http://www.yasuoji120.com";//定义URL
var obj = document.getElementByIdx_x('ss');
window.onload = function(){

skip()//执行函数

}

function skip(){ //主函数

if(t<=0){ //已经到0秒
  return 0;
}
t--
obj.innerHTML = t; //页面显示数值
if(t==0){
  window.location.href=url;  //跳转页面
}
window.setTimeout(skip,1*1000);  //一秒执行一次本函数
}


</script>

</body>
</html>



注释写的很清楚了,各位根据自己要求修改下就可以使用了。
分享到:
评论

相关推荐

    html JavaScript js倒计时跳转页面

    标题 "html JavaScript js倒计时跳转页面" 涉及到的是网页开发中的一个常见功能,即在特定时间后自动跳转至另一个页面。这个功能通常由JavaScript实现,配合HTML来显示倒计时效果。JavaScript是一种轻量级的解释型...

    倒计时十秒后跳转到其它页面源代码

    首先,实现这种倒计时跳转的主要技术是JavaScript,它是一种广泛应用于网页动态效果和交互的脚本语言。在JavaScript中,我们可以使用`setTimeout`函数来设定一个延迟执行的任务,比如在特定时间(例如10秒)后执行...

    js倒计时跳转

    通过以上步骤,你可以实现一个JavaScript倒计时跳转的功能,同时传递参数到新页面。在实际应用中,根据业务需求,你可能还需要考虑一些其他因素,比如用户交互中断倒计时、页面刷新时保持倒计时状态等。

    html5 css3圆形进度条倒计时页面跳转代码

    通过设置`width`和`height`相同,我们可以创建一个完美的圆形。进度条的填充部分则可以通过`background-color`和`transition`属性来控制颜色变化和动画效果。例如,进度条的填充会随着时间的流逝逐渐增加,直到达到...

    倒计时跳转页面

    在Web开发中,有时需要实现一种功能:在用户完成某个特定操作后(如表单提交成功、登录验证通过等),页面会显示一个倒计时,告知用户将在多少秒后自动跳转到另一个页面。这种设计不仅能够提升用户体验,还能确保...

    HTML+CSS+JS 春节倒计时跳转烟花特效

    【HTML+CSS+JS 春节倒计时跳转烟花特效】是一个综合性的网页开发项目,结合了HTML、CSS和JavaScript技术,旨在为用户呈现一个富有节日氛围的互动体验。这个项目有两个主要部分:春节倒计时和烟花特效。 首先,HTML...

    5秒倒计时后跳转到指定网址HTML5源码源码资源下载整理.zip

    这个资源可以帮助开发者或学习者理解如何在网页中设置一个倒计时,以便在特定时间后自动重定向用户到另一个网址。 在HTML5中,这种功能通常通过JavaScript来实现,而不是直接在HTML标记中完成。JavaScript是一种...

    HTML 5秒倒计时跳转指定网站源码.zip

    总结来说,这个HTML 5秒倒计时跳转源码展示了如何利用HTML5和JavaScript实现一个简单的动态网页功能。对于初学者,这是一个很好的实践项目,可以学习到HTML的基础结构,以及如何使用JavaScript进行页面交互。同时,...

    js倒计时30秒才能点击跳转页面代码

    本文将详细介绍如何使用JavaScript编写一个30秒倒计时的点击跳转页面代码。 首先,我们需要理解JavaScript中的基本定时器概念。`setTimeout`函数是JavaScript中用于设置延迟执行函数的工具。它接受两个参数:要执行...

    js显示倒计时跳转页面

    本文将详细介绍如何利用JavaScript结合JQuery来实现一个简单的网页倒计时,并在倒计时结束后自动跳转到另一个页面。 #### 一、HTML结构定义 首先,我们需要定义一个基本的HTML结构,用于显示倒计时数字: ```html...

    网站简约404页面倒计时跳转源码.zip

    4. **跳转逻辑**:JavaScript代码会包含一个跳转函数,当倒计时结束后,将自动重定向用户到预设的URL。这可以通过修改`window.location.href`实现。 5. **用户交互**:可能还会包含一个“返回首页”或“搜索”按钮...

    html5 css3圆形进度条倒计时页面跳转代码.zip

    在这个“html5 css3圆形进度条倒计时页面跳转代码”项目中,我们可以看到一个结合了HTML、CSS以及JavaScript(可能包括jQuery)的实用示例,实现了圆形进度条展示时间倒计时,并在倒计时结束时自动跳转到指定页面。...

    javascript十秒倒计时跳转页面

    自学了javascript,第一次自己写的一个十秒倒计时的调整页面。。

    漂亮的倒计时跳转404页面

    综上所述,构建一个"漂亮的倒计时跳转404页面"涉及到网页设计原则、用户体验优化以及前端JavaScript技术的应用。通过合理的设计和编程,我们可以为用户提供一个既美观又能有效引导他们返回网站其他部分的404页面。在...

    jquery实现倒计时,支持多行分别无限循环倒计时

    - 如果需要在同一页面上展示多个倒计时,可以使用循环结构,针对每个倒计时元素创建一个独立的倒计时实例。 - 每个倒计时元素可以通过特定的class或data属性来区分,例如`...

    javascript秒数倒计时自动跳转代码.docx

    本篇文章将详细介绍如何使用JavaScript实现一个简单的秒数倒计时自动跳转功能。 #### 二、需求分析 根据题目描述,我们需要实现的功能是: 1. **显示倒计时**:以秒为单位进行倒计时。 2. **自动跳转**:当倒计时...

    html5 css3圆形进度条倒计时页面跳转代码.rar

    在这个“html5 css3圆形进度条倒计时页面跳转代码”项目中,开发者结合JavaScript(JS)创建了一个实用的前端特效,即一个圆形进度条在达到一定进度后触发页面跳转,这在网页应用中常用于倒计时活动或加载状态的展示...

    jQuery创意精美的网页倒计时代码

    这个倒计时插件的实现,不仅展示了jQuery在网页动态效果中的强大功能,也体现了JavaScript处理时间和日期的能力。用户可以轻松自定义倒计时时间,而倒计时界面则实时更新,为网站增添了一份互动性与视觉吸引力。这样...

    倒计时跳转.html

    运用js文件呈现出,倒计时跳转的html文件,js中的一个小技巧

Global site tag (gtag.js) - Google Analytics