подскажите, пожалуйста, как сделать так, чтобы не моргала картинка фона. Размер картинки 13 кб. На странице стоят несколько ссылок. При наведении на ссылку фон меняется на другой такой же, но с небольшим изменением. При этом иногда он меняется мгновенно. А иногда он как бы моргает, т.е. появляется белый фон перед сменой картинки на новую. Из-за чего это может происходить? Из-за большого размера картинки? Или из-за чего-то другого? Картинку меняю с помощью javascript. Она помещается как фон элемента div, в который входят все другие теги внутри тега <body>.
Подскажите, как можно сделать так, чтобы картинка при наведении на ссылку сменялась без моргания.
Если можно, подскажите пожалуйста, как вообще делаются такие эффекты. Как стоит делать и как не стоит. При смене фона сайта - вся картинка не меняется, просто на женском лице загораются глаза. Т.е. сам фон это фотография женского лица модели.
Заранее спасибо
Спустя 14 минут, 48 секунд (2.08.2010 - 01:25) Ice написал(а):
Моргать начинает тогда, когда кеш браузера сбрасывается. Уменьшите картинку.
Спустя 52 секунды (2.08.2010 - 01:26) arvitaly написал(а):
Сделай так: помести все меняющиеся картинки в одну, ее сделай бекграундом в div'е а у дива меняй background-position, тогда все картинки как бы подгрузятся сразу и не будет скакания
Спустя 5 часов, 34 минуты, 19 секунд (2.08.2010 - 07:01) Michael написал(а):
Моргает потому что браузеру требуется время, чтобы получить эту картинку. Решается кешированием необходимых картинок:
Самое простое - при загрузке страницы так прописать все необходимые тебе картинки. Ну и присваивание лучше сделать тоже через них:
var im1 = new Image();
im1.src = 'img/my1.gif';
Самое простое - при загрузке страницы так прописать все необходимые тебе картинки. Ну и присваивание лучше сделать тоже через них:
document.getElementById('imm1').style.backgroundImage = im1.src;
Спустя 13 часов, 4 секунды (2.08.2010 - 20:01) arvitaly написал(а):
Кеширование может быть и отключено
Спустя 7 минут, 39 секунд (2.08.2010 - 20:08) sergeiss написал(а):
Можно сделать еще проще... Просто реально подгрузить все картинки при загрузке страницы, можно даже без JS. А именно, подгружаем нужные картинки (в отдельном тэге img), задаем им размер типа 1*1 и положение где-нибудь слева от страницы.
Тогда они реально будут сидеть в кеше по окончании загрузки. И меняться будут мгновенно - если только комп не будет тормозить.
Тогда они реально будут сидеть в кеше по окончании загрузки. И меняться будут мгновенно - если только комп не будет тормозить.
Спустя 4 минуты, 22 секунды (2.08.2010 - 20:13) arvitaly написал(а):
Я так пробовал, в опере все равно моргало, единственный способ был как я написал
Спустя 3 часа, 14 минут, 27 секунд (2.08.2010 - 23:27) program90 написал(а):
Спасибо! Сделал как посоветовал Arvitaly - поместил две картинки в одну.
Спустя 5 месяцев, 2 дня, 12 часов, 22 минуты, 10 секунд (5.01.2011 - 12:49) Гость_Павел написал(а):
чтобы она плавно появлялась за 2 секунды:
1. пропишите код css
2. пропишите html
3. скачайте jQuery
вот и всё!
1. пропишите код css
div_1{
background: url('img1');
}
div_2{
background: url('img1');
}
2. пропишите html
<a href="#" id="my_link">Ссылка меняет фон!</a><div id="div_1"></div><div id="div_2"></div>
3. скачайте jQuery
$('#div2').hide();
$('#my_link').click(function(){
$('#div_2').fadeIn(2000);
});
вот и всё!
Спустя 3 дня, 13 часов, 45 минут, 1 секунда (9.01.2011 - 02:34) program90 написал(а):
Гость_Павел
Спасибо!
Спасибо!