基于javascript实现的购物商城商品倒计时实例
网络编程 2021-07-04 19:19www.168986.cn编程入门
本文主要介绍了基于javascript实现的购物商城商品倒计时实例,代码详细,可直接复制试试看效果。需要的朋友可以参考借鉴
话不多说,狼蚁网站SEO优化跟着长沙网络推广一起来看下实例代码吧
Js:
/ Author: Black_Jay郗 downCount: 时间转换 倒计时 / (function ($) { $.fn.downCount = function (options, callback) { var settings = $.extend({ date: null, offset: null }, options); if (!settings.date) { $.error('Date is not defined.'); } if (!Date.parse(settings.date)) { $.error('Incorrect date format, it should look like this, 12/24/2012 12:00:00.'); } var container = this; var currentDate = function () { var date = new Date(); /var utc = date.getTime() + (date.getTimezoneOffset() 60000); var new_date = new Date(utc + (3600000settings.offset));/ return date; }; function countdown () { var target_date = new Date(settings.date), current_date = currentDate(); var difference = target_date - current_date; if (difference < 0) { clearInterval(interval);//取消 setInterval() 函数设定的定时执行操作 if (callback && typeof callback === 'function') callback(); return; } var _second = 1000, _minute = _second 60, _hour = _minute 60, _day = _hour 24; var days = Math.floor(difference / _day), hours = Math.floor(((difference % _day) / _hour) + (days24)), minutes = Math.floor((difference % _hour) / _minute), seconds = Math.floor((difference % _minute) / _second); days = (String(days).length >= 2) ? days : '0' + days; hours = (String(hours).length >= 2) ? hours : '0' + hours; minutes = (String(minutes).length >= 2) ? minutes : '0' + minutes; seconds = (String(seconds).length >= 2) ? seconds : '0' + seconds; container.find('.hours').text(hours); container.find('.minutes').text(minutes); container.find('.seconds').text(seconds); }; var interval = setInterval(countdown, 1000); }; })(jQuery);
html:
<!-- 倒计时显示Star --> <p class="countdown"> <span class="hours">00</span>: <span class="minutes">00</span>: <span class="seconds">00</span> </p> <!-- 倒计时End -->
输入你想要的结束时间
JS
$('.countdown').downCount({ date: '11/09/2016 13:45:00', offset: +10 }, function () { alert('秒杀已结束'); });
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望多多支持狼蚁SEO!
编程语言
- 如何快速学会编程 如何快速学会ug编程
- 免费学编程的app 推荐12个免费学编程的好网站
- 电脑怎么编程:电脑怎么编程网咯游戏菜单图标
- 如何写代码新手教学 如何写代码新手教学手机
- 基础编程入门教程视频 基础编程入门教程视频华
- 编程演示:编程演示浦丰投针过程
- 乐高编程加盟 乐高积木编程加盟
- 跟我学plc编程 plc编程自学入门视频教程
- ug编程成航林总 ug编程实战视频
- 孩子学编程的好处和坏处
- 初学者学编程该从哪里开始 新手学编程从哪里入
- 慢走丝编程 慢走丝编程难学吗
- 国内十强少儿编程机构 中国少儿编程机构十强有
- 成人计算机速成培训班 成人计算机速成培训班办
- 孩子学编程网上课程哪家好 儿童学编程比较好的
- 代码编程教学入门软件 代码编程教程