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 相关文章推荐
javascript类继承机制的原理分析
Sep 12 Javascript
javascript之bind使用介绍
Oct 09 Javascript
自定义函数实现IE7与IE8不兼容js中trim函数的问题
Feb 03 Javascript
JavaScript中数据结构与算法(二):队列
Jun 19 Javascript
用Move.js配合创建CSS3动画的入门指引
Jul 22 Javascript
JS模拟酷狗音乐播放器收缩折叠关闭效果代码
Oct 29 Javascript
详解JavaScript中的构造器Constructor模式
Jan 14 Javascript
easyui combotree加载静态数据问题(选不上)解决方法
Dec 26 Javascript
jquery中$.fn和图片滚动效果实现的必备知识总结
Apr 21 jQuery
Vue实现简单分页器
Dec 29 Javascript
node express使用HTML模板的方法示例
Aug 22 Javascript
解决在Vue中使用axios POST请求变成OPTIONS的问题
Aug 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
example1.php
2006/10/09 PHP
win7 64位系统 配置php最新版开发环境(php+Apache+mysql)
2014/08/15 PHP
php中stdClass的用法分析
2015/02/27 PHP
yii2超好用的日期组件和时间组件
2016/05/05 PHP
javascript import css实例代码
2008/07/18 Javascript
jquery实现商品拖动选择效果代码(自写)
2013/05/28 Javascript
基于NodeJS的前后端分离的思考与实践(五)多终端适配
2014/09/26 NodeJs
JavaScript使用cookie实现记住账号密码功能
2015/04/27 Javascript
javascript的 {} 语句块详解
2016/02/27 Javascript
基于jQuery日历插件制作日历
2016/03/11 Javascript
jquery dialog获取焦点的方法
2017/02/09 Javascript
js实现日期显示的一些操作(实例讲解)
2017/07/27 Javascript
JavaScript复制内容到剪贴板的两种常用方法
2018/02/27 Javascript
基于 Immutable.js 实现撤销重做功能的实例代码
2018/03/01 Javascript
详解ajax的data参数错误导致页面崩溃
2018/04/30 Javascript
vue底部加载更多的实例代码
2018/06/29 Javascript
微信小程序实现限制用户转发功能的实例代码
2020/02/22 Javascript
JS如何定义用字符串拼接的变量
2020/07/11 Javascript
VUE : vue-cli中去掉路由中的井号#操作
2020/09/04 Javascript
[46:14]VGJ.T vs Liquid 2018国际邀请赛小组赛BO2 第一场 8.19
2018/08/21 DOTA
python基于multiprocessing的多进程创建方法
2015/06/04 Python
在Django的session中使用User对象的方法
2015/07/23 Python
教你用 Python 实现微信跳一跳(Mac+iOS版)
2018/01/04 Python
python3 读写文件换行符的方法
2018/04/09 Python
Python基于递归和非递归算法求两个数最大公约数、最小公倍数示例
2018/05/21 Python
一步步教你用python的scrapy编写一个爬虫
2019/04/17 Python
Python如何使用27行代码绘制星星图
2020/07/20 Python
python 日志模块logging的使用场景及示例
2021/01/04 Python
python之openpyxl模块的安装和基本用法(excel管理)
2021/02/03 Python
TripAdvisor斯洛伐克:阅读评论、比较价格和酒店预订
2018/04/25 全球购物
化验室技术员岗位职责
2013/12/24 职场文书
报告会主持词
2014/04/02 职场文书
老干部工作先进集体事迹材料
2014/05/21 职场文书
投标文件签署授权委托书范本
2014/10/12 职场文书
MySQL5.7并行复制原理及实现
2021/06/03 MySQL
mysql insert 存在即不插入语法说明
2022/03/25 MySQL