Гость
Целевая тема:
Создать новую тему:
Автор:
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / JS. Зациклить таймер обратного отсчета. / 10 сообщений из 10, страница 1 из 1
10.09.2013, 18:04
    #38392716
son6ka
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
JS. Зациклить таймер обратного отсчета.
Здравствуйте. Использую вот этот таймер
Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
74.
75.
76.
77.
78.
79.
80.
81.
82.
83.
84.
85.
86.
87.
88.
89.
90.
91.
92.
93.
94.
95.
96.
97.
98.
99.
100.
101.
102.
103.
104.
105.
106.
107.
108.
109.
110.
111.
112.
113.
114.
115.
116.
117.
118.
119.
120.
121.
122.
123.
124.
125.
126.
127.
128.
129.
130.
(function($){
	
	// Number of seconds in every time division
	var days	= 24*60*60,
		hours	= 60*60,
		minutes	= 60;
	
	// Creating the plugin
	$.fn.countdown = function(prop){
		
		var options = $.extend({
			callback	: function(){},
			timestamp	: 0
		},prop);
		
		var left, d, h, m, s, positions;

		// Initialize the plugin
		init(this, options);
		
		positions = this.find('.position');
		
		(function tick(){
			
			// Time left
			left = Math.floor((options.timestamp - (new Date())) / 1000);
			
			if(left < 0){
				left = 0;
			}
			
			// Number of days left
			d = Math.floor(left / days);
			updateDuo(0, 1, d);
			left -= d*days;
			
			// Number of hours left
			h = Math.floor(left / hours);
			updateDuo(2, 3, h);
			left -= h*hours;
			
			// Number of minutes left
			m = Math.floor(left / minutes);
			updateDuo(4, 5, m);
			left -= m*minutes;
			
			// Number of seconds left
			s = left;
			updateDuo(6, 7, s);
			
			// Calling an optional user supplied callback
			options.callback(d, h, m, s);
			
			// Scheduling another call of this function in 1s
			setTimeout(tick, 1000);
		})();
		
		// This function updates two digit positions at once
		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');

		// Creating the markup inside the container
		$.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>');
			}
		});

	}

	// Creates an animated transition between the two numbers
	function switchDigit(position,number){
		
		var digit = position.find('.digit')
		
		if(digit.is(':animated')){
			return false;
		}
		
		if(position.data('digit') == number){
			// We are already showing this number
			return false;
		}
		
		position.data('digit', number);
		
		var replacement = $('<span>',{
			'class':'digit',
			css:{
				top:'-2.1em',
				opacity:0
			},
			html:number
		});
		
		// The .static class is added when the animation
		// completes. This makes it run smoother.
		
		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);



вот так:

Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
var note = $('#note'),
        ts = new Date(2013,08, 12, 00,00,00),
        newYear = true;
    
    if((new Date()) > ts){
        ts = (new Date()).getTime() + 2*24*60*60*1000;
        newYear = false;
    }
        
    $('#countdown').countdown({
        timestamp   : ts,
        callback    : function(days, hours, minutes, seconds){
            
            var message = "";
            
            message += days + " day" + ( days==1 ? '':'s' ) + ", ";
            message += hours + " hour" + ( hours==1 ? '':'s' ) + ", ";
            message += minutes + " minute" + ( minutes==1 ? '':'s' ) + " and ";
            message += seconds + " second" + ( seconds==1 ? '':'s' ) + " 
";
            
            if(newYear){
                message += "left until the new year!";
            }
            else {
                message += "left to 10 days from now!";
            }
            
            note.html(message);
        }
    });



Нужно зациклить таймер на двух днях. Не разберусь, как это сделать.

Спасибо.
...
Рейтинг: 0 / 0
11.09.2013, 18:41
    #38394041
Zoria
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
JS. Зациклить таймер обратного отсчета.
son6kaЗдравствуйте. Использую вот этот таймер
Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
74.
75.
76.
77.
78.
79.
80.
81.
82.
83.
84.
85.
86.
87.
88.
89.
90.
91.
92.
93.
94.
95.
96.
97.
98.
99.
100.
101.
102.
103.
104.
105.
106.
107.
108.
109.
110.
111.
112.
113.
114.
115.
116.
117.
118.
119.
120.
121.
122.
123.
124.
125.
126.
127.
128.
129.
130.
(function($){
	
	// Number of seconds in every time division
	var days	= 24*60*60,
		hours	= 60*60,
		minutes	= 60;
	
	// Creating the plugin
	$.fn.countdown = function(prop){
		
		var options = $.extend({
			callback	: function(){},
			timestamp	: 0
		},prop);
		
		var left, d, h, m, s, positions;

		// Initialize the plugin
		init(this, options);
		
		positions = this.find('.position');
		
		(function tick(){
			
			// Time left
			left = Math.floor((options.timestamp - (new Date())) / 1000);
			
			if(left < 0){
				left = 0;
			}
			
			// Number of days left
			d = Math.floor(left / days);
			updateDuo(0, 1, d);
			left -= d*days;
			
			// Number of hours left
			h = Math.floor(left / hours);
			updateDuo(2, 3, h);
			left -= h*hours;
			
			// Number of minutes left
			m = Math.floor(left / minutes);
			updateDuo(4, 5, m);
			left -= m*minutes;
			
			// Number of seconds left
			s = left;
			updateDuo(6, 7, s);
			
			// Calling an optional user supplied callback
			options.callback(d, h, m, s);
			
			// Scheduling another call of this function in 1s
			setTimeout(tick, 1000);
		})();
		
		// This function updates two digit positions at once
		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');

		// Creating the markup inside the container
		$.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>');
			}
		});

	}

	// Creates an animated transition between the two numbers
	function switchDigit(position,number){
		
		var digit = position.find('.digit')
		
		if(digit.is(':animated')){
			return false;
		}
		
		if(position.data('digit') == number){
			// We are already showing this number
			return false;
		}
		
		position.data('digit', number);
		
		var replacement = $('<span>',{
			'class':'digit',
			css:{
				top:'-2.1em',
				opacity:0
			},
			html:number
		});
		
		// The .static class is added when the animation
		// completes. This makes it run smoother.
		
		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);



вот так:

Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
var note = $('#note'),
        ts = new Date(2013,08, 12, 00,00,00),
        newYear = true;
    
    if((new Date()) > ts){
        ts = (new Date()).getTime() + 2*24*60*60*1000;
        newYear = false;
    }
        
    $('#countdown').countdown({
        timestamp   : ts,
        callback    : function(days, hours, minutes, seconds){
            
            var message = "";
            
            message += days + " day" + ( days==1 ? '':'s' ) + ", ";
            message += hours + " hour" + ( hours==1 ? '':'s' ) + ", ";
            message += minutes + " minute" + ( minutes==1 ? '':'s' ) + " and ";
            message += seconds + " second" + ( seconds==1 ? '':'s' ) + " 
";
            
            if(newYear){
                message += "left until the new year!";
            }
            else {
                message += "left to 10 days from now!";
            }
            
            note.html(message);
        }
    });



Нужно зациклить таймер на двух днях. Не разберусь, как это сделать.

Спасибо.

Это чтобы после двух что показывалось? :)
...
Рейтинг: 0 / 0
11.09.2013, 18:44
    #38394045
Паганель
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
JS. Зациклить таймер обратного отсчета.
за простыню без дрозофилы на ПТ бы заклевали
...
Рейтинг: 0 / 0
12.09.2013, 10:11
    #38394324
son6ka
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
JS. Зациклить таймер обратного отсчета.
Zoria,
после двух опять два)) По кругу.
...
Рейтинг: 0 / 0
12.09.2013, 12:58
    #38394607
Zoria
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
JS. Зациклить таймер обратного отсчета.
Паганель
за простыню без дрозофилы на ПТ бы заклевали

Слава Богу, здесь вам не там. :) А вообще я - так случайно то же цитатнула:)
...
Рейтинг: 0 / 0
12.09.2013, 12:59
    #38394610
Zoria
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
JS. Зациклить таймер обратного отсчета.
а с каких пор спойлер в спойлере не работает?
...
Рейтинг: 0 / 0
12.09.2013, 13:00
    #38394614
Zoria
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
JS. Зациклить таймер обратного отсчета.
son6kaZoria,
после двух опять два)) По кругу.
а когда именно это после двух? %)
...
Рейтинг: 0 / 0
12.09.2013, 13:12
    #38394632
son6ka
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
JS. Зациклить таймер обратного отсчета.
Zoria,
счетчик отсчитывает два дня в обратном направлении, после того, как два дня истекают, отсчет начинается сначала.
1:23:59:59 - > 0:00:00:00 - > 1:23:59:59
...
Рейтинг: 0 / 0
12.09.2013, 14:02
    #38394722
Zoria
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
JS. Зациклить таймер обратного отсчета.
son6kaZoria,
счетчик отсчитывает два дня в обратном направлении, после того, как два дня истекают, отсчет начинается сначала.
1:23:59:59 - > 0:00:00:00 - > 1:23:59:59
ааа :) ну теперь вам осталось только отловить, когда произошло "истекло" и запустить его заново на 2 дня.
...
Рейтинг: 0 / 0
12.09.2013, 14:51
    #38394819
son6ka
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
JS. Зациклить таймер обратного отсчета.
Zoria,

смешно. Спасибо за помощь)
...
Рейтинг: 0 / 0
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / JS. Зациклить таймер обратного отсчета. / 10 сообщений из 10, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]