02-22-2013, 07:33 PM
Подарите плиз сщетчик который в точности бы он точно работал, так как моим почемуто примерное время можно подобрать(
Код
/**
* @name jQuery Countdown Plugin
* @author Martin Angelov
* @version 1.0
* @url http://tutorialzine.com/2011/12/countdown-jquery/
* @license MIT License
*/
(function($){
//Чисдо секунд в каждом временном промежутке
var days = 24*60*60,
hours = 60*60,
minutes = 60;
//Создание плагина
$.fn.countdown = function( prop )
{
var options = $.extend({
callback : function(){},
timestamp : 0
},prop);
var left, d, h, m, s, positions;
//Инициализация плагина
init(this, options);
positions = this.find('.position');
(function tick()
{
//Оставшееся время
left = Math.floor((options.timestamp - (new Date())) / 1000);
if( left < 0 ) left = 0;
//Оставшееся число дней
d = Math.floor(left / days);
updateDuo(0, 1, d);
left -= d*days;
//Оставшееся число часов
h = Math.floor(left / hours);
updateDuo(2, 3, h);
left -= h*hours;
//Оставшееся число минут
m = Math.floor(left / minutes);
updateDuo(4, 5, m);
left -= m*minutes;
//Оставшееся число секунд
s = left;
updateDuo(6, 7, s);
//Вызов необязательного, предоставляемого пользователем callback-а
options.callback(d, h, m, s);
//Планирование следующего вызова этой функции через 1с
setTimeout(tick, 1000);
})();
//Эта функция, зараз /*SeoRomin.com.ua*/, меняет позиции двух цифр
function updateDuo( minor, major, value )
{
switchDigit(positions.eq(minor),Math.floor(value/10)%10);
switchDigit(positions.eq(major),value%10);
}
return this;
};
function init( elem, options )
{
elem.addClass('countdownHolder');
//Создание разметки в контейнере
$.each(['Days','Hours','Minutes','Seconds'],function(i)
{
$('<span class="count'+this+'">').html(
'<span class="position">\
<span class="digit static">0</span>\
</span>\
<span class="position">\
<span class="digit static">0</span>\
</span>'
).appendTo(elem);
if( this!="Seconds" ) {
elem.append('<span class="countDiv countDiv'+i+'"></span>');
}
});
}
//Создает анимированный переход между двумя числами
function switchDigit( position, number )
{
var digit = position.find('.digit')
if( digit.is(':animated') ) return false;
//Мы уже показываем это число
if( position.data('digit') == number ) return false;
position.data('digit', number);
var replacement = $('<div>',{
'class':'digit',
css:{
top:'-2.1em',
opacity:0
},
html:number
});
//Класс .static добавляется когда анимация завершена.
//Так будет работать более гладко.
digit
.before(replacement)
.removeClass('static')
.animate({top:'2.5em',opacity:0},'fast',function(){
digit.remove();
})
replacement
.delay(100)
.animate({top:0,opacity:1},'fast',function(){
replacement.addClass('static');
});
}
})(jQuery);
* @name jQuery Countdown Plugin
* @author Martin Angelov
* @version 1.0
* @url http://tutorialzine.com/2011/12/countdown-jquery/
* @license MIT License
*/
(function($){
//Чисдо секунд в каждом временном промежутке
var days = 24*60*60,
hours = 60*60,
minutes = 60;
//Создание плагина
$.fn.countdown = function( prop )
{
var options = $.extend({
callback : function(){},
timestamp : 0
},prop);
var left, d, h, m, s, positions;
//Инициализация плагина
init(this, options);
positions = this.find('.position');
(function tick()
{
//Оставшееся время
left = Math.floor((options.timestamp - (new Date())) / 1000);
if( left < 0 ) left = 0;
//Оставшееся число дней
d = Math.floor(left / days);
updateDuo(0, 1, d);
left -= d*days;
//Оставшееся число часов
h = Math.floor(left / hours);
updateDuo(2, 3, h);
left -= h*hours;
//Оставшееся число минут
m = Math.floor(left / minutes);
updateDuo(4, 5, m);
left -= m*minutes;
//Оставшееся число секунд
s = left;
updateDuo(6, 7, s);
//Вызов необязательного, предоставляемого пользователем callback-а
options.callback(d, h, m, s);
//Планирование следующего вызова этой функции через 1с
setTimeout(tick, 1000);
})();
//Эта функция, зараз /*SeoRomin.com.ua*/, меняет позиции двух цифр
function updateDuo( minor, major, value )
{
switchDigit(positions.eq(minor),Math.floor(value/10)%10);
switchDigit(positions.eq(major),value%10);
}
return this;
};
function init( elem, options )
{
elem.addClass('countdownHolder');
//Создание разметки в контейнере
$.each(['Days','Hours','Minutes','Seconds'],function(i)
{
$('<span class="count'+this+'">').html(
'<span class="position">\
<span class="digit static">0</span>\
</span>\
<span class="position">\
<span class="digit static">0</span>\
</span>'
).appendTo(elem);
if( this!="Seconds" ) {
elem.append('<span class="countDiv countDiv'+i+'"></span>');
}
});
}
//Создает анимированный переход между двумя числами
function switchDigit( position, number )
{
var digit = position.find('.digit')
if( digit.is(':animated') ) return false;
//Мы уже показываем это число
if( position.data('digit') == number ) return false;
position.data('digit', number);
var replacement = $('<div>',{
'class':'digit',
css:{
top:'-2.1em',
opacity:0
},
html:number
});
//Класс .static добавляется когда анимация завершена.
//Так будет работать более гладко.
digit
.before(replacement)
.removeClass('static')
.animate({top:'2.5em',opacity:0},'fast',function(){
digit.remove();
})
replacement
.delay(100)
.animate({top:0,opacity:1},'fast',function(){
replacement.addClass('static');
});
}
})(jQuery);