倒计时效果显示

<!DOCTYPE html>
<html>
<head>
    <title>倒计时效果显示</title>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
    <script type="text/javascript" src="https://code.jquery.com/jquery.js"></script>
    <script type="text/javascript">
    $(document).ready(function() {
        var interval = 1000;
        function ShowCountDown(year,month,day,divname)
        {
            function checkTime(i) {
                if (i<10) {
                    i="0"+i;
                }
                return i;
            }
            var now = new Date();
            var endDate = new Date(year, month-1, day);
            var leftTime=endDate.getTime()-now.getTime();
            var leftsecond = parseInt(leftTime/1000);
            var day1=Math.floor(leftsecond/(60*60*24));
            var hour=Math.floor((leftsecond-day1*24*60*60)/3600);
            var minute=Math.floor((leftsecond-day1*24*60*60-hour*3600)/60);
            var second=Math.floor(leftsecond-day1*24*60*60-hour*3600-minute*60);
            hour=checkTime(hour);
            minute=checkTime(minute);
            second=checkTime(second);
            var cc = document.getElementById(divname);
            cc.innerHTML = "仅剩:"+day1+"天"+hour+"小时"+minute+"分"+second+"秒";
        }
        window.setInterval(function(){ShowCountDown(2015,9,20,‘showTime‘);}, interval);
    })
    </script>
</head>
<body>
<p id="showTime">仅剩:0天02小时00分15秒</p>
</body>
</html>

时间: 2024-12-24 03:45:01

倒计时效果显示的相关文章

javascript特效实现(4)——当前时间和倒计时效果

这个效果的实现关键是对Date对象和setTimeout的使用. 一共有三个例子,HTML结构如下,就不添加CSS样式了. <body> 当前时间:<p id="p1"></p> 高考倒计时:<p id="p2"></p> 限时抢购:<p id="p3"></p> </body> 主要体会javascript的实现 window.onload=func

Andorid实现点击获取验证码倒计时效果

这篇文章主要介绍了Andorid实现点击获取验证码倒计时效果,这种效果大家经常遇到,想知道如何实现的,请阅读本文 我们在开发中经常用到倒计时的功能,比如发送验证码后,倒计时60s再进行验证码的获取,为了方便以后使用,这里做个记录,讲讲倒计时器的实现. 1.先进行倒计时工具类的封装 1 public class CountDownTimerUtils extends CountDownTimer { 2 private TextView mTextView; 3 4 /** 5 * @param

bobojQuery实现倒计时效果

使用jQuery实现倒计时效果,这个实例是在页面上显示剩余几天几小时几分几秒的效果. 在头部引用最新的jQuery.js文件: <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script src="jQuery.js" type="text/javascript"></scri

超实用的JavaScript代码段 Item1 --倒计时效果

现今团购网.电商网.门户网等,常使用时间记录重要的时刻,如时间显示.倒计时差.限时抢购等,本文分析不同倒计时效果的计算思路及方法,掌握日期对象Date,获取时间的方法,计算时差的方法,实现不同的倒时计效果. 1.简单时间显示 讲解日期对象Date,并通过该对象获取时.分.秒等,让你自由提取所需时间内容. <!DOCTYPE html> <html> <head> <title>获取时间</title> <script type="

jQuery实现的手机发送验证码倒计时效果代码分享

这是一款基于jquery实现的手机发送验证码倒计时效果代码,可实现实时显示秒数倒计时的功能,还可实现对手机号码格式验证的功能,是一款常用的网站注册发送手机验证码特效代码. 效果描述:注册一个网站,当需要发送验证码到手机上的时候,我们经常碰到这样的效果:首先检测手机是否符合1开头,11位数字的格式:若不符合,则提示错误信息并返回false:否则提交给后台,后台确定接收后返回一个值,发送按钮变为灰色并倒计时. 运行效果: 年利率高达14.4% 上海投融理财,20万起投,年化收益14.4% 房产抵押,

jQuery实现倒计时效果-杨秀徐

本实例效果:剩余368天22小时39分57秒结束 代码简单易懂,适用各种倒计时: <!DOCTYPE html> <head> <title>jQuery实现倒计时效果-杨秀徐</title> <script type="text/javascript" src="/scripts/jquery.js"></script> <script type="text/javascrip

当前时间和倒计时效果

这个效果的实现关键是对Date对象和setTimeout的使用. 一共有三个例子,HTML结构如下,就不添加CSS样式了. <body> 当前时间:<p id="p1"></p> 高考倒计时:<p id="p2"></p> 限时抢购:<p id="p3"></p> </body> 主要体会javascript的实现 window.onload=func

双十一购物倒计时效果

马上双十一了,过了零点小伙伴们就要各自对放在购物车里的订单下单了,今日特写一个倒计时效果. 倒计时的主要思路: 知道结束时间的时间戳,当前的时间戳,结束的时间减去当前的时间就是,倒计时需要显示的时间差.然后对天.小时.分钟.秒,运行换算. 这里强调一个函数function todouble(),就是把换算出来的时间不足2位的,在数字前面加上一个“0”,比如1秒,变成01秒,2分钟变成02分钟.. 然后依次修改图片的top值在页面中显示.下面上代码. 1 <!DOCTYPE html PUBLIC

ecshop促销时间倒计时效果

ecshop促销时间倒计时效果的实现如下: 1.首先修改程序部分 打开includes/lib_goods.php 找到get_promote_goods()函数部分 在 $goods[$idx]['url'] = build_uri('goods', array('gid' => $row['goods_id']), $row['goods_name']); 下面增加代码 $time = gmtime(); if ($time >= $row['promote_start_date'] &a