jQuery/JavaScript: срабатывает при предварительной загрузке

jQuery имеет функцию .ready(), но я не уверен, что это то, что мне нужно:

Я установил фоновое изображение по умолчанию в CSS (изображение 1 из 4) после загрузки документа (изображения и все, а не только DOM); Я хочу начать предварительную загрузку фонового изображения 2 из 4. После того, как оно загружено, я хочу превратить изображение 1 в изображение 2. Затем я хочу предварительно загрузить следующее изображение (3 из 4), как только оно будет загружено, я хочу переход от фонового изображения 2 к изображению 3 и, наконец, предварительная загрузка изображения 4. После загрузки изображения 4 я хотел бы превратить изображение 3 в изображение 4. После этого я хочу переключаться между изображениями с заданным интервалом времени.

Какую стратегию я бы использовал, чтобы решить эту проблему? Функция .load()?

Спасибо за уделенное время.

С уважением,
Мариус


javascript jquery background-image triggers preload
person Mikkel Rev    schedule 10.05.2010    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Jquery.ready() или еще лучше $() сработает после успешной загрузки последнего элемента страницы. Оттуда вы можете приступить к запуску цепочки методов, каждый из которых запускает следующий в переданном ему обратном вызове.

person David Perlman    schedule 10.05.2010
comment
Анимации асинхронные и отбрасывает много людей. Это предложение хорошее. - person Jay; 10.05.2010
comment
Я знаю об этом, но это не то, чего я хочу. Каждое фоновое изображение будет довольно большим, поэтому я бы предпочел сделать это так, как я предложил: загрузить первое изображение, а затем переходить к следующему, как только оно будет загружено, а не ждать, пока все они будут загружены. - person Mikkel Rev; 10.05.2010
comment
Это отправная точка, которую вы затем привяжете к событию .load изображений. api.jquery.com/load-event - person David Perlman; 10.05.2010