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 相关文章推荐
认识延迟时间为0的setTimeout
May 16 Javascript
jQuery+CSS实现的网页二级下滑菜单效果
Aug 25 Javascript
JQuery为元素添加样式的实现方法
Jul 20 Javascript
简易的JS计算器实现代码
Oct 18 Javascript
js与jquery分别实现tab标签页功能的方法
Nov 18 Javascript
基于three.js实现的3D粒子动效实例代码
Apr 09 Javascript
微信小程序云开发实现增删改查功能
May 17 Javascript
Layui之table中的radio在切换分页时无法记住选中状态的解决方法
Sep 02 Javascript
详解react组件通讯方式(多种)
May 06 Javascript
vue实现点击按钮“查看详情”弹窗展示详情列表操作
Sep 09 Javascript
对vue生命周期的深入理解
Dec 03 Vue.js
vue watch监控对象的简单方法示例
Jan 07 Vue.js
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
apache php模块整合操作指南
2012/11/16 PHP
ThinkPHP跳转页success及error模板实例教程
2014/07/17 PHP
ThinkPHP V2.2说明文档没有说明的那些事实例小结
2015/07/01 PHP
php防止网站被攻击的应急代码
2015/10/21 PHP
教大家制作简单的php日历
2015/11/17 PHP
Flash对联广告的关闭按钮讨论
2007/01/30 Javascript
javascript new 需不需要继续使用
2009/07/02 Javascript
有关js的变量作用域和this指针的讨论
2010/12/16 Javascript
跨浏览器的事件对象介绍
2012/06/27 Javascript
JQueryEasyUI datagrid框架的进阶使用
2013/04/08 Javascript
php和js对数据库图片进行等比缩放示例
2014/04/28 Javascript
JavaScript获得页面base标签中url的方法
2015/04/03 Javascript
javaScript中Math()函数注意事项
2015/06/18 Javascript
浅析JavaScript 调试方法和技巧
2015/10/22 Javascript
剖析Node.js异步编程中的回调与代码设计模式
2016/02/16 Javascript
js获取页面及个元素高度、宽度的代码
2016/04/26 Javascript
Bootstrap 最常用的JS插件系列总结(图片轮播、标签切换等)
2016/07/14 Javascript
easyui简介_动力节点Java学院整理
2017/07/14 Javascript
JavaScript实现数字前补“0”的五种方法示例
2019/01/03 Javascript
原生js实现无缝轮播图效果
2021/01/28 Javascript
[24:42]VP vs TNC Supermajor小组赛B组 BO3 第三场 6.2
2018/06/03 DOTA
[58:59]完美世界DOTA2联赛PWL S3 access vs CPG 第一场 12.13
2020/12/16 DOTA
Python中实现常量(Const)功能
2015/01/28 Python
python实现bucket排序算法实例分析
2015/05/04 Python
python 图像判断,清晰度(明暗),彩色与黑白实例
2020/06/04 Python
Python 高效编程技巧分享
2020/09/10 Python
CSS3 filter(滤镜)实现网页灰色或者黑色模式的示例代码
2021/02/24 HTML / CSS
美国卡车、吉普车和SUV零件网站:4 Wheel Parts
2016/11/24 全球购物
施华洛世奇美国官网:SWAROVSKI美国
2018/02/08 全球购物
Linux内核的同步机制是什么?主要有哪几种内核锁
2016/07/11 面试题
客户表扬信范文
2014/01/10 职场文书
三万活动总结
2014/04/28 职场文书
爱情保证书大全
2014/04/29 职场文书
信用卡工资证明范本
2014/10/17 职场文书
2016大学生优秀志愿者事迹材料
2016/02/25 职场文书
解决Jupyter-notebook不弹出默认浏览器的问题
2021/03/30 Python