javascript实现促销倒计时+fixed固定在底部


Posted in Javascript onSeptember 18, 2013
<!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"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<title>无标题文档</title> 
<style> 
#lefttime3 { background: url(timerbg.jpg) no-repeat left center; width:1018px;height:55px; 
font-size:40px;line-height: 55px;font-family: MS Yahei,Microsoft YaHei; 
color: #f00;color:rgb(255,205,1); 
} 
#day{ margin-left: 592px;} 
#hour { margin-left:40px; } 
#min { margin-left: 39px;} 
#sec { margin-left: 37px;} 
</style> 
<script> var djs = function(d,o) 
{ 
var f = { 
zero: function(n){ 
var n = parseInt(n, 10); 
if(n > 0) { 
if(n <= 9) n = '0' + n; 
return String(n); 
} else { 
return '00'; 
} 
}, 
run: function(){ 
var ts = Math.round((new Date(d).getTime() - new Date().getTime()) / 1000); 
if(o && ts > 0) 
{ 
var yy = Math.floor(ts / 31556926); 
var mm = Math.floor(ts / 2629744); mm = mm > 0 ? mm%12 : '00'; 
var dd = Math.floor(ts / 86400); dd = dd > 0 ? dd%30 : '00'; 
var hh = Math.floor(ts / 3600); hh = hh > 0 ? hh%24 : '00'; 
var ii = Math.floor(ts / 60); ii = ii > 0 ? ii%60 : '00'; 
var ss = Math.floor(ts % 60); 
if(o.y) o.y.innerHTML = f.zero(yy); 
if(o.m) o.m.innerHTML = f.zero(mm); 
if(o.d) o.d.innerHTML = f.zero(dd); 
if(o.h) o.h.innerHTML = f.zero(hh); 
if(o.i) o.i.innerHTML = f.zero(ii); 
if(o.s) o.s.innerHTML = f.zero(ss); 
} 
window.setTimeout(f.run,1000); 
} 
} 
f.run(); 
} 
function ieFixed(id) 
{ 
var isIE = (document.all) ? true : false; 
var isIE6 = isIE && ([/MSIE (\d)\.0/i.exec(navigator.userAgent)][0][1] == 6); 
var obj = document.getElementById(id).style; 
if (isIE6 && obj) 
{ 
obj.position = "absolute"; 
obj.bottom = "0px"; 
obj.right = "0px"; 
var tm = window.setInterval(function(){ 
obj.marginBottom = "0px"; 
obj.left = ( document.documentElement.scrollLeft + document.documentElement.clientWidth - 312) + "px"; 
}, 80); 
} 
} 
</script> 
</head> 
<body style="height:300000px;"> 
<div id="lll" style="margin:10px;padding:20px; border:solid 2px #DDD; background:#fc6;height:300px;"></div> 
<div id="lefttime3" style="position:fixed;bottom:0px;right:0px;"><span id="day"></span><span id="hour"></span><span id="min"></span><span id="sec"></span></div> 
<script> 
var d = new Date().getTime() + 3600*24*1000; 
var d = 1379572933131; 
var o = { 
d: document.getElementById('day'), 
h: document.getElementById('hour'), 
i: document.getElementById('min'), 
s: document.getElementById('sec') 
} 
djs(d,o);//倒计时 
ieFixed('lefttime3'); //固定在底部 
</script> 
</body> 
</html>

1)兼容IE6
2)自动倒计时,输入的数字必须是时间,单位毫秒。
Javascript 相关文章推荐
jQuery图片特效插件Revealing实现拉伸放大
Apr 22 Javascript
JavaScript定时器和优化的取消定时器方法
Jul 03 Javascript
jQuery 1.9.1源码分析系列(十三)之位置大小操作
Dec 02 Javascript
Highcharts使用简例及异步动态读取数据
Dec 30 Javascript
JS获取字符串实际长度(包含汉字)的简单方法
Aug 11 Javascript
原生js实现新闻列表展开/收起全文功能
Jan 20 Javascript
Angular 4环境准备与Angular cli创建项目详解
May 27 Javascript
JavaScript设计模式之观察者模式实例详解
Jan 16 Javascript
简单了解JavaScript中的执行上下文和堆栈
Jun 24 Javascript
JavaScript setInterval()与setTimeout()计时器
Dec 27 Javascript
微信小程序实现电子签名功能
Jul 29 Javascript
用javascript制作qq注册动态页面
Apr 14 Javascript
jquery等宽输出文字插件使用介绍
Sep 18 #Javascript
使用indexOf等在JavaScript的数组中进行元素查找和替换
Sep 18 #Javascript
JSON 数字排序多字段排序介绍
Sep 18 #Javascript
json数据与字符串的相互转化示例
Sep 18 #Javascript
如何让DIV可编辑、可拖动示例代码
Sep 18 #Javascript
jQuery extend 的简单实例
Sep 18 #Javascript
Javascript中Event属性搜集整理
Sep 17 #Javascript
You might like
php面向对象全攻略 (十七) 自动加载类
2009/09/30 PHP
PHP中使用unset销毁变量并内存释放问题
2012/07/05 PHP
ThinkPHP CURD方法之table方法详解
2014/06/18 PHP
Zend Framework教程之Zend_Helpers动作助手ViewRenderer用法详解
2016/07/20 PHP
PHP实现登陆并抓取微信列表中最新一组微信消息的方法
2017/07/10 PHP
ThinkPHP 5.1 跨域配置方法
2019/10/11 PHP
laravel框架路由分组,中间件,命名空间,子域名,路由前缀实例分析
2020/02/18 PHP
jquery 弹出登录窗口实现代码
2009/12/24 Javascript
JavaScript 选中文字并响应获取的实现代码
2011/08/28 Javascript
javascript学习笔记(十四) window对象使用介绍
2012/06/20 Javascript
php对mongodb的扩展(初识如故)
2012/11/11 Javascript
Nodejs中自定义事件实例
2014/06/20 NodeJs
JS 实现计算器详解及实例代码(一)
2017/01/08 Javascript
JS得到当前时间的方法示例
2017/03/24 Javascript
JavaScript 字符串数字左补位,右补位,取固定长度,截位扩展函数代码
2017/03/25 Javascript
JS闭包用法实例分析
2017/03/27 Javascript
JavaScript实现简单音乐播放器
2020/04/17 Javascript
ES6的Fetch异步请求的实现方法
2018/12/07 Javascript
JS左右无缝轮播功能完整实例
2019/05/16 Javascript
angularjs自定义过滤器demo示例
2019/08/24 Javascript
python日期相关操作实例小结
2019/06/24 Python
python selenium 查找隐藏元素 自动播放视频功能
2019/07/24 Python
python如何使用Redis构建分布式锁
2020/01/16 Python
浅析python标准库中的glob
2020/03/13 Python
HTML5+CSS3网页加载进度条的实现,下载进度条的代码实例
2016/12/30 HTML / CSS
HTML5 HTMLCollection和NodeList的区别详解
2020/04/29 HTML / CSS
公司综合部的成员自我评价分享
2013/11/05 职场文书
会计专业大学生职业生涯规划范文
2014/01/11 职场文书
安全检查管理制度
2014/02/02 职场文书
医学专业毕业生求职信
2014/06/20 职场文书
学校清明节活动总结
2014/07/04 职场文书
村班子对照检查材料
2014/08/18 职场文书
2015毕业寄语大全
2015/02/26 职场文书
以权谋私检举信范文
2015/03/02 职场文书
python xlwt模块的使用解析
2021/04/13 Python
JavaScript流程控制(循环)
2021/12/06 Javascript