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 相关文章推荐
PNGHandler-借助JS让PNG图在IE下实现透明(包括背景图)
Aug 31 Javascript
Javascript继承(上)——对象构建介绍
Nov 08 Javascript
JSONP 跨域访问代理API-yahooapis实现代码
Dec 02 Javascript
javascript 实现简单的table排序及table操作练习
Dec 28 Javascript
jquery中prop()方法和attr()方法的区别浅析
Sep 06 Javascript
js动态创建标签示例代码
Jun 09 Javascript
纯JS实现旋转图片3D展示效果
Apr 12 Javascript
JavaScript实现自动对页面上敏感词进行屏蔽的方法
Jul 27 Javascript
Jquery zTree 树控件异步加载操作
Feb 25 Javascript
简单的网页广告特效实例
Aug 19 Javascript
Vue项目中添加锁屏功能实现思路
Jun 29 Javascript
微信小程序官方动态自定义底部tabBar的例子
Sep 04 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
打造计数器DIY三步曲(中)
2006/10/09 PHP
JavaScript设计模式之单例模式实例
2014/09/24 Javascript
jQuery实现仿美橙互联两级导航菜单的方法
2015/03/09 Javascript
jQuery插件slicebox实现3D动画图片轮播切换特效
2015/04/12 Javascript
jquery实现简单的表单验证
2015/11/17 Javascript
js实现浏览器倒计时跳转页面效果
2016/08/12 Javascript
原生JS实现首页进度加载动画
2016/09/14 Javascript
jQuery select自动选中功能实现方法分析
2016/11/28 Javascript
原生JS和jQuery操作DOM对比总结
2017/01/19 Javascript
jquery.rotate.js实现可选抽奖次数和中奖内容的转盘抽奖代码
2017/08/23 jQuery
vue配置请求本地json数据的方法
2018/04/11 Javascript
在angularJs中进行数据遍历的2种方法
2018/10/08 Javascript
JavaScript中concat复制数组方法浅析
2019/01/20 Javascript
微信小程序实现工作时间段选择
2019/02/15 Javascript
layui问题之自动滚动二级iframe页面到指定位置的方法
2019/09/18 Javascript
Vue使用v-viewer实现图片预览
2020/10/21 Javascript
python和shell实现的校验IP地址合法性脚本分享
2014/10/23 Python
Python中方法链的使用方法
2016/02/23 Python
Python3如何解决字符编码问题详解
2017/04/23 Python
python利用正则表达式搜索单词示例代码
2017/09/24 Python
Python 逐行分割大txt文件的方法
2017/10/10 Python
Python把对应格式的csv文件转换成字典类型存储脚本的方法
2019/02/12 Python
Python内置函数locals和globals对比
2020/04/28 Python
Python 基于jwt实现认证机制流程解析
2020/06/22 Python
python判断all函数输出结果是否为true的方法
2020/12/03 Python
python源文件的字符编码知识点详解
2021/03/04 Python
荷兰家电购物网站:Expert.nl
2020/01/18 全球购物
十佳美德少年事迹材料
2014/02/05 职场文书
简历中自我评价怎么写
2014/02/12 职场文书
我的教育故事演讲稿
2014/05/04 职场文书
成立公司计划书
2014/05/07 职场文书
确保工程质量承诺书
2015/04/29 职场文书
大学感恩节活动总结
2015/05/05 职场文书
《烈火英雄》观后感:致敬和平时代的英雄
2019/11/11 职场文书
vue打包时去掉所有的console.log
2022/04/10 Vue.js
vue本地构建热更新卡顿的问题“75 advanced module optimization”完美解决方案
2022/08/05 Vue.js