Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 22.10.2010, 00:47
Интересующийся
Отправить личное сообщение для latter-day Посмотреть профиль Найти все сообщения от latter-day
 
Регистрация: 22.10.2010
Сообщений: 15

Как реализовать поочерёдную смену картинок в 2-х слайдшоу?
На главной странице сайта http://m2project.ru/ нужно организовать смену картинок в шахматном порядке: сначала левая, потом - правая, снова левая, потом -правая и т.д.

В js секу плохо, если не сказать, что не секу.

Сейчас картинки меняются синхронно.
Скрипт (нагло стащенный и немного переделанный под себя ) выглядит так:

var slider1 = {
images: ["1.jpg","2.jpg","3.jpg","4.jpg","5.jpg","6.jpg "],
index: 1,
start: function() {
setInterval("slider1.work()", 3000);
},
work: function() {
$('#slider_private').append('<img src="' + $('#slider_private .prev').attr('src') + '"id="next">');
$('#slider_private .prev').attr('src', 'pic/private/340/' + slider1.images[this.index]);
$('#slider_private #next').fadeOut(1500, function() { $(this).remove(); });

this.index++;
if (this.index >= slider1.images.length) this.index = 0;

}
};
slider1.start();

var slider2 = {
images: ["1.jpg","2.jpg","3.jpg","4.jpg","5.jpg","6.jpg "],
index: 1,
start: function() {
setInterval("slider2.work()", 3000);
},
work: function() {
$('#slider_public').append('<img src="' + $('#slider_public .prev').attr('src') + '"id="next">');
$('#slider_public .prev').attr('src', 'pic/public/340/' + slider2.images[this.index]);
$('#slider_public #next').fadeOut(1500, function() { $(this).remove(); });

this.index++;
if (this.index >= slider2.images.length) this.index = 0;

}
};
slider2.start();

_________________________________________________

Помогите реализовать смену картинок в шахматном порядке. Оч надо.
Заранее благодарен.


P.S. В целом, как я понимаю, нужно, чтобы второй скрипт запускался через какое-то время после первого (скажем, через 1500 мс). Как это сделать?

Последний раз редактировалось latter-day, 22.10.2010 в 00:58.
Ответить с цитированием
  #2 (permalink)  
Старый 22.10.2010, 16:00
Кандидат Javascript-наук
Отправить личное сообщение для Jurasmi Посмотреть профиль Найти все сообщения от Jurasmi
 
Регистрация: 25.11.2008
Сообщений: 115

var slider1 = {
	images: ["1.jpg","2.jpg","3.jpg","4.jpg","5.jpg","6.jpg "],
	index: 1,
	work: function() {
		$('#slider_private').append('<img src="' + $('#slider_private .prev').attr('src') + '"id="next">');
		$('#slider_private .prev').attr('src', 'pic/private/340/' + slider1.images[this.index]);
		$('#slider_private #next').fadeOut(1500, function() { $(this).remove(); });

		this.index++;
		if (this.index >= slider1.images.length){
			this.index = 0;
		}
	}
};


var slider2 = {
	images: ["1.jpg","2.jpg","3.jpg","4.jpg","5.jpg","6.jpg "],
	index: 1,
	work: function() {
		$('#slider_public').append('<img src="' + $('#slider_public .prev').attr('src') + '"id="next">');
		$('#slider_public .prev').attr('src', 'pic/public/340/' + slider2.images[this.index]);
		$('#slider_public #next').fadeOut(1500, function() { $(this).remove(); });

		this.index++;
		if (this.index >= slider2.images.length){
			this.index = 0;
		}
	}
};


setInterval("slider1.work()", 3000);
setTimeout("setInterval('slider2.work()', 3000)", 1500);
Ответить с цитированием
  #3 (permalink)  
Старый 22.10.2010, 23:11
Интересующийся
Отправить личное сообщение для latter-day Посмотреть профиль Найти все сообщения от latter-day
 
Регистрация: 22.10.2010
Сообщений: 15

Спасибо, Jurasmi. +1 в карму)
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как реализовать функцию Sberrr Javascript под браузер 1 28.09.2010 19:52
Как реализовать скроллинг в Div-е до указанной строки таблицы. Shabol Элементы интерфейса 3 24.09.2010 14:19
Как реализовать взаимодействие окон? JSTalker ExtJS 1 29.06.2010 14:29
Как реализовать вывод такого окна nastya Events/DOM/Window 4 04.02.2010 05:41
Как реализовать? Fliand Элементы интерфейса 4 22.08.2009 19:47