js如何实现广告图片在指定日期内显示,过期后显示另外的图片,求代码!! 100
例图片A设定在2000年10月01日0时0分0秒显示,至2000年10月31日0时0分0秒止,过期后,显示图片B,图片链接链接也跟着转换。...
例 图片A设定在2000年10月01日0时0分0秒显示, 至2000年10月31日0时0分0秒止,过期后,显示图片B,图片链接链接也跟着转换。
展开
2个回答
展开全部
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>Document</title>
<script src="jq.js"></script><!--引入的jquery库-->
</head>
<body>
<div class="show">
<a data-name="url">
<img data-name="img"/>
</a>
</div>
</body>
<script>
var obj = [{
time: '2015-07-07 14:50:00',
imgUrl: '1.png',
href: 'www.a.com'
},{
time: '2015-07-07 14:51:00',
imgUrl: '2.png',
href: 'www.b.com'
},{
time: '2015-07-07 14:52:00',
imgUrl: '3.png',
href: 'www.c.com'
}];
var siv = setInterval(function() {
var date = new Date(),
time = date.getTime(),
i = 0,
len = obj.length;
for(; i < len; i++) {
var o = obj[i],
t = (new Date(o.time)).getTime(),
boo = t - time > 0 ? true : false;
if(boo) {
$('[data-name="url"]').attr('href', o.href);
$('[data-name="img"]').attr('src', o.imgUrl);
break;
}
}
if(i === len) {
clearInterval(siv);
}
}, 500);
</script>
</html>
obj存储的是某个时间显示的img的地址和链接地址以及时间这几个属性组成的对象的数组,当到某个时间会调用对应的数据,当显示到最后一个数组对象时,清除定时器
展开全部
用jquery,试试下面代码,只需更改开始和结束时间。
<html>
<head>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('#slide > a').each(function(){
var now = new Date().getTime();
var time_start = new Date($(this).attr('s_time')).getTime();
var time_end = new Date($(this).attr('e_time')).getTime();
var time_1 = now - time_start;
var time_2 = time_end - now;
if (time_1 > 0 && time_2 > 0){
$(this).show();
} else {
$(this).hide();
}
});
});
</script>
</head>
<body>
<div id="slide">
<a href="#" s_time="2015/07/04 00:00:00" e_time="2015/07/05 00:00:00" style="display:none;"><img src="1.jpg" alert="显示中" /></a>
<a href="#" s_time="2015/07/06 00:00:00" e_time="2015/07/07 00:00:00" style="display:none;"><img src="2.jpg" alert="未到期" /></a>
<a href="#" s_time="2015/07/01 00:00:00" e_time="2015/07/02 00:00:00" style="display:none;"><img src="3.jpg" alert="已过期" /></a>
</div>
</body>
</html>
更多追问追答
追问
jquery.min.js的代码在哪里弄啊? 第二个未到期怎么用的?
追答
jquery.min.js上面代码中是百度的cdn公共库地址,可以直接调用;也可以打开后保存到本地。
未到期改成未上架容易理解呵呵...时间段:7月6号-7月7号
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询
广告 您可能关注的内容 |