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中call和apply方法浅谈
Sep 27 Javascript
jquery单选框radio绑定click事件实现方法
Jan 14 Javascript
jquery.gridrotator实现响应式图片展示画廊效果
Jun 23 Javascript
jQuery事件绑定用法详解(附bind和live的区别)
Jan 19 Javascript
使用Object.defineProperty实现简单的js双向绑定
Apr 15 Javascript
js 获取图像缩放后的实际宽高,位置等信息
Mar 07 Javascript
angular ng-click防止重复提交实例
Jun 16 Javascript
vue 中directive功能的简单实现
Jan 05 Javascript
使用React手写一个对话框或模态框的方法示例
Apr 25 Javascript
从零撸一个pc端vue的ui组件库( 计数器组件 )
Aug 08 Javascript
微信小程序云开发获取文件夹下所有文件(推荐)
Nov 14 Javascript
36个正则表达式(开发效率提高80%)
Nov 17 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
ionCube 一款类似zend的PHP加密/解密工具
2010/07/25 PHP
使用PHPExcel操作Excel用法实例分析
2015/03/26 PHP
Laravel Intervention/image图片处理扩展包的安装、使用与可能遇到的坑详解
2017/11/14 PHP
Jquery chosen动态设置值实例介绍
2013/08/08 Javascript
js实现支持手机滑动切换的轮播图片效果实例
2015/04/29 Javascript
AngularJS基础知识笔记之表格
2015/05/10 Javascript
基于jquery实现简单的手风琴特效
2015/11/24 Javascript
浅析AMD CMD CommonJS规范--javascript模块化加载学习心得总结
2016/03/16 Javascript
jQuery中ztree 点击文本框弹出下拉框的实例代码
2017/02/05 Javascript
javaScript封装的各种写法
2017/08/14 Javascript
vue服务端渲染的实例代码
2017/08/28 Javascript
详解React项目的服务端渲染改造(koa2+webpack3.11)
2018/03/19 Javascript
基于vue-simplemde实现图片拖拽、粘贴功能
2018/04/12 Javascript
Vue登录注册并保持登录状态的方法
2018/08/17 Javascript
微信小程序实现的日期午别医生排班表功能示例
2019/01/09 Javascript
js常见遍历操作小结
2019/06/06 Javascript
微信小程序动态显示项目倒计时
2019/06/20 Javascript
vue+layui实现select动态加载后台数据的例子
2019/09/20 Javascript
vue 监听窗口变化对页面部分元素重新渲染操作
2020/07/28 Javascript
js实现类选择器和name属性选择器的示例步骤
2021/02/07 Javascript
Python时间戳与时间字符串互相转换实例代码
2013/11/28 Python
Python使用random和tertools模块解一些经典概率问题
2015/01/28 Python
python实现登陆知乎获得个人收藏并保存为word文件
2015/03/16 Python
浅谈django model的get和filter方法的区别(必看篇)
2017/05/23 Python
Python数据结构与算法之链表定义与用法实例详解【单链表、循环链表】
2017/09/28 Python
python 叠加等边三角形的绘制的实现
2019/08/14 Python
浅析matlab中imadjust函数
2020/02/27 Python
django 取消csrf限制的实例
2020/03/13 Python
解决django的template中如果无法引用MEDIA_URL问题
2020/04/07 Python
浅谈利用缓存来优化HTML5 Canvas程序的性能
2015/05/12 HTML / CSS
购买澳大利亚最好的服装和内衣在线:BONDS
2016/10/14 全球购物
入党综合考察材料
2014/06/02 职场文书
垃圾桶标语
2014/06/24 职场文书
工作所在部门证明
2014/09/21 职场文书
2014年作风建设剖析材料
2014/10/23 职场文书
面试通知短信
2015/04/20 职场文书