Javascript.RU

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

Задерженная смена фонового изображения массива.
Тут такое дело, имеется массив элементов 15 дивов с разными бг-имэйджами, мне нужно по очереди их брать с интервалом 0.5-1 секунды и менять им значения бг-имейджа. (урл самого изображения, размер и смещение по игерку).

делал так:

var arr2 = jQuery.makeArray($('.item'));
console.log(arr2);
var arr2_length = arr2.length;
console.log(arr2_length);
var j = 0;
var timer = setInterval(function() {
        if(j < (arr2_length - 1)) {
			console.log('sta');
			img2 = arr2[j].getAttribute('data-image');
			arr2[j].style.background = "img2 no-repeat 0 -100px";
			j++;
        } else {
            clearInterval(timer);
        }
    }, 1000);


но ничего не вышло, цикл идет, изображения не меняются...
Ах, да data-image - это как раз урл второй картинки.
Выглядит примерно так:
"url(/.../7486.jpg)"
Ответить с цитированием
  #2 (permalink)  
Старый 11.11.2013, 16:23
Аватар для BETEPAH
Профессор
Отправить личное сообщение для BETEPAH Посмотреть профиль Найти все сообщения от BETEPAH
 
Регистрация: 23.06.2011
Сообщений: 1,165

Сообщение от feniks7
arr2[j].style.background = "img2 no-repeat 0 -100px";
может так?
arr2[j].style.background = img2 + " no-repeat 0 -100px";
Сделайте песочницу с кодом для наглядности и отладки
Ответить с цитированием
  #3 (permalink)  
Старый 11.11.2013, 17:37
Аспирант
Отправить личное сообщение для feniks7 Посмотреть профиль Найти все сообщения от feniks7
 
Регистрация: 08.07.2013
Сообщений: 51

Благодарю, как всегда глупая ошибка...
Готовый вид у меня выглядит так:
/*Цикл с задержкой для подгрузки изображений*/
var arr2 = jQuery.makeArray($('.item'));
console.log(arr2);
var arr2_length = arr2.length;
console.log(arr2_length);
var j = 0;
var timer = setInterval(function() {
        if(j < (arr2_length - 1)) {
			console.log('sta');
			img2 = arr2[j].getAttribute('data-image');
			arr2[j].style.background = img2 + "no-repeat 0 -100px";
			arr2[j].style.backgroundSize = "100%";
			j++;
        } else {
            clearInterval(timer);
        }
}, 1000);


Все работает, по крайней мере в опере, хроме и осле.

Если кому интересно использовал для порциональной догрузки страницы. Ну тоесть у меня на странице 32 изображения, по требованиям должны быть сразу все. Но они тяжелые, я оптимизировал по максимуму с 6 МБ до 300-700кб. Вместо них грузятся изображения по 10-20кб и то изображение, котрое в данный момент смотрит юзер, вэто время по тихому запускается цикл этот самый и догружает фотки по очереди. Эффект получился неплохой, сильно снизилась скорость загрузки страницы, по тестам именно по изображениям примерно в 10-12 раз.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Смена фона изображения при клике на иконку Letto Элементы интерфейса 2 16.06.2013 17:16
JS + CSS Под загрузка фонового изображения XboxPro Элементы интерфейса 0 14.11.2012 11:16
Частая смена изображения lead-in Events/DOM/Window 2 02.03.2012 15:28
смена фонового цвета Kiev Общие вопросы Javascript 2 23.06.2010 00:56
Смена изображения MaxB Events/DOM/Window 7 10.02.2010 22:01