【发布时间】:2016-04-13 15:14:18
【问题描述】:
我有这个幻灯片(JS Fiddle:https://jsfiddle.net/toon09/zopnqxry/) 一切都适用,但我希望幻灯片根据星期几和一天中的时间开始。
即如果今天是星期一(中午 12 点到早上 7 点),从幻灯片 1 开始,如果今天是星期一(早上 7 点到中午 12 点),从幻灯片 2 开始放映幻灯片,如果今天是星期二,从幻灯片 3 开始,以此类推。
$(document).ready(function() {
//rotation speed and timer
var speed = 900000000;
var run = setInterval('rotate()', speed);
//grab the width and calculate left value
var item_width = $('#slides li').outerWidth();
var left_value = item_width * (-1);
//move the last item before first item, just in case user click prev button
$('#slides li:first').before($('#slides li:last'));
//set the default item to the correct position
$('#slides ul').css({'left' : left_value});
//if user clicked on prev button
$('#prev').click(function() {
//get the right position
var left_indent = parseInt($('#slides ul').css('left')) + item_width;
//slide the item
$('#slides ul:not(:animated)').animate({'left' : left_indent}, 200,function(){
//move the last item and put it as first item
$('#slides li:first').before($('#slides li:last'));
//set the default item to correct position
$('#slides ul').css({'left' : left_value});
});
//cancel the link behavior
return false;
});
//if user clicked on next button
$('#next').click(function() {
//get the right position
var left_indent = parseInt($('#slides ul').css('left')) - item_width;
//slide the item
$('#slides ul:not(:animated)').animate({'left' : left_indent}, 200, function () {
//move the first item and put it as last item
$('#slides li:last').after($('#slides li:first'));
//set the default item to correct position
$('#slides ul').css({'left' : left_value});
});
//cancel the link behavior
return false;
});
//if mouse hover, pause the auto rotation, otherwise rotate it
$('#slides').hover(
function() {
clearInterval(run);
},
function() {
run = setInterval('rotate()', speed);
}
);
});
//a simple function to click next link
//a timer will call this function, and the rotation will begin :)
function rotate() {
$('#next').click();
}
html:
<div id="carousel">
<div class="clear"></div>
<div id="slides">
<ul>
<li>If today monday and its from 12 pm till 7:30 <br>am,start showing from this slide</li>
<li>If today monday and its from 7:30 am till 11:59 pm,<br>start showing from this slide</li>
<li>if today is other day of the week<br> (from tuesday to sunday)start slideshow from this slide</li>
</ul>
<div class="clear"></div>
</div>
<div class="tarpas"></div>
<div id="buttons1">
<a href="#" id="prev">prev</a>
<div class="clear"></div>
</div>
<div id="buttons2">
<a href="#" id="next">next</a>
<div class="clear"></div>
</div>
有可能做到吗?谁能帮我解决这个问题?厌倦了搜索谷歌:)
【问题讨论】:
-
记录在案:cmets 应该解释 为什么 你的代码做了它所做的,而不是 what 正在发生.. 如果不是很明显给另一个程序员,那么你应该致力于重构你的代码而不是添加 cmets
标签: javascript slideshow slide