Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 09.08.2017, 13:32
Новичок на форуме
Отправить личное сообщение для Научите Посмотреть профиль Найти все сообщения от Научите
 
Регистрация: 09.08.2017
Сообщений: 3

Меняем картинки поочередно
Всем привет ! Подскажити пожалуйсто может кто уже решал подобное. Задача вот в чем, должен быть масив картинок к примерку 10 шт. две картинки одна слева другая-справа и оди дожны по очереди меняться сначало левая потом правая через 0.5с, и так без остановки Ну и кнопка пауза чтоб остановить/продолжить
Ответить с цитированием
  #2 (permalink)  
Старый 09.08.2017, 14:16
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Сообщение от Научите
должен быть масив картинок к примерку 10 шт. две картинки одна слева другая-справа и оди дожны по очереди меняться сначало левая потом правая
Как коррелируют 10 картинок в две, что слева и справа? Если только две меняются местами.
Ответить с цитированием
  #3 (permalink)  
Старый 09.08.2017, 14:50
Новичок на форуме
Отправить личное сообщение для Научите Посмотреть профиль Найти все сообщения от Научите
 
Регистрация: 09.08.2017
Сообщений: 3

ну мы видим какбы только две картинки они на весь екран widt: 50% displey:inline-block. остальные нужно показывать fade in/fade out
Ответить с цитированием
  #4 (permalink)  
Старый 09.08.2017, 15:06
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Научите, и в чем тебе подсказать? Что уже сделал сам?
Ответить с цитированием
  #5 (permalink)  
Старый 09.08.2017, 15:16
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,650

<html>
<head>
<style>
	img{
		margin: 0;
		width: 50%;
	}
</style>
</head>
<body>
<img src="" alt=""><img src="" alt="">
	<script>
var arr = ['1.jpg','2.jpg','3.jpg','4.jpg','5.jpg'];
var arr2 = ['6.jpg','7.jpg','8.jpg','9.jpg','10.jpg'];
var img = document.querySelectorAll('img'), i = 0;

setInterval(()=>{
	img[0].src = arr[i];
	setTimeout(()=>img[1].src = arr2[i],500);
	i++;
	if (i==5) i=0;
},1000);

	</script>
</body>
</html>
Ответить с цитированием
  #6 (permalink)  
Старый 09.08.2017, 17:34
Новичок на форуме
Отправить личное сообщение для Научите Посмотреть профиль Найти все сообщения от Научите
 
Регистрация: 09.08.2017
Сообщений: 3

Спасибо
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Смена картинки при нажатии на маленькие картинки comb Элементы интерфейса 4 23.03.2015 01:08
Очистка памяти, отмена загрузки картинки, отмена события. zhurchik Общие вопросы Javascript 16 23.10.2014 13:48
Идентифицировать картинки MellDixX Общие вопросы Javascript 8 04.08.2013 18:16
Получение координат от картинки EmDmAl Events/DOM/Window 4 08.11.2009 14:34
Как изменить размер картинки? Mihail Общие вопросы Javascript 1 25.10.2009 13:42