Opera 11.5 мерцание изображения - PullRequest
Новая
       2

Opera 11.5 мерцание изображения

0 голосов
/ 25 августа 2011

У меня маленькая крошечная проблема, касающаяся слайд-шоу на основе jQuery в Opera.

Что я делаю, так это следующее. У меня есть пара изображений: 

<div id="bg">
<img src="..." />
<img src="..." />
...
</div>

В JS я делаю следующее: 

$('#bg img:visible').hide().next().show();

Поскольку я жду загрузки всех изображений перед созданием страницы, это должно создать незаметный переход от одного изображения к другому. Это прекрасно работает в Chrome, Safari, Firefox и IE. Тем не менее, в Опере у меня довольно длинный (вероятно, 1/4 секунды) период, когда я вижу (черный) фон сквозь. Я также попытался сделать это: 

$('#bg img:visible').next().show().prev().hide();

но это не имело никакого значения, поэтому я думаю, что это проблема движка Opera.

Тем не менее - и хотя я знаю, что на начальном уровне это является придиркой - мне было бы интересно, если бы кто-нибудь сталкивался с этим раньше и, возможно, знает обходной путь или исправление?

Спасибо!

Ответы [ 3 ]

1 голос
/ 25 августа 2011

Opera имеет другой способ и время обработки, когда она переформатирует / отображает изменения, сделанные в JavaScript - в основном она пытается обновить изменения JavaScript быстрее, чем другие браузеры.См. Эффективный JavaScript из статей Opera dev.Хотя я удивлен, что вы заметили это изменение.Это может быть связано со скоростью вашей машины для разработки в сочетании с размером изображений, драйвером дисплея и т. Д. Что он делает на других машинах?А как насчет других версий Opera?

В зависимости от вашего макета, вы можете попробовать поместить второе изображение под (через z-index) первым, а затем показать () второе (даже если оно будет покрыто по-прежнему прина этот раз), затем спрятать () первый, который покажет второе, что было внизу.

1 голос
/ 24 апреля 2012

Я решил проблему мерцания в Opera (при загрузке новой html-страницы), поместив все 

<script type="text/javascript" .....></script>

строки непосредственно ПОСЛЕ <head> на странице.

Если поместить просто до </head> (или ниже ЛЮБОЙ строки или тега html в этом отношении), страница будет мигать при загрузке.

Если весь Javascript будет размещен сразу после <head>, страница будетне мерцает.

1 голос
/ 25 августа 2011

Это кажется довольно странным, и я предполагаю, что это как-то связано со спецификой вашей реализации. Может создать jsfiddle, который показывает проблему?

Как правило, использование hide()...show() (или наоборот) может вызвать заметные побочные эффекты. Когда что-то скрыто, весь макет может измениться, поскольку оставшиеся видимые элементы занимают доступное в настоящее время пространство, а затем снова изменятся при отображении следующего изображения. Эти события происходят в режиме реального времени, поэтому вы рассчитываете на то, что происходит достаточно быстро в любой среде, которую использует ваш пользователь, чтобы сделать плавный переход.

Единственный способ убедиться в этом - использовать абсолютное позиционирование для двух изображений (или вообще областей), о которых идет речь. Они должны занимать одно и то же физическое пространство в браузере. Затем сделайте свое шоу / скрыть. На самом деле даже не имеет значения, какой из них имеет более высокий z-индекс, либо новый будет отображаться конечному пользователю, как только он будет показан, или как только другой будет скрыт.

...