Изображения gif и png исчезают только в IE8

6 моих изображений (png и анимированный gif при наведении курсора) не загружаются только в IE8, я тестировал в большинстве браузеров на Mac и Windows, и IE8 — единственный, где изображения не загружаются. На самом деле они появляются в IE7, я проверял в Интернете решения или похожие проблемы, но не могу найти правильного решения.

Вот ссылка на эту страницу: http://tinyurl.com/8ydbp6y

вот html этого конкретного раздела

    <ul class="about-icons">
         <li id="about-love"><a href="includes/content/content-love.html" target="content-load"><img src="images/about/icon-thankyou.png" onmouseover="this.src='images/about/icon-thankyou.gif'" onmouseout="this.src='images/about/icon-thankyou.png'"/></a></li>
          <li id="about-japan"><a href="includes/content/content-japan.html" target="content-load"><img src="images/about/icon-japan.png" onmouseover="this.src='images/about/icon-japan.gif'" onmouseout="this.src='images/about/icon-japan.png'"/></a></li>
       <li  id="about-icecream" class="no-margin-right"><a href="includes/content/content-icecream.html" target="content-load"><img src="images/about/icon-icecream.png" onmouseover="this.src='images/about/icon-icecream.gif'" onmouseout="this.src='images/about/icon-icecream.png'"/></a></li>
    </ul> 
    <br/>  
    <div id="about-whymochiko" ><img src="images/about/whymochiko.png" alt="Why Mochiko"/></div>
    <br/>
    <ul class="about-icons">
       <li id="about-flavors"><a href="includes/content/content-flavors.html" target="content-load"><img src="images/about/icon-flavors.png" onmouseover="this.src='images/about/icon-flavors.gif'" onmouseout="this.src='images/about/icon-flavors.png'"/></a></li>
       <li id="about-ingredients"><a href="includes/content/content-ingredients.html" target="content-load"><img src="images/about/icon-ingredients.png" onmouseover="this.src='images/about/icon-ingredients.gif'" onmouseout="this.src='images/about/icon-ingredients.png'"/></a></li>
       <li id="about-milk" class="no-margin-right"><a href="includes/content/content-milk.html" target="content-load"><img src="images/about/icon-milk.png" onmouseover="this.src='images/about/icon-milk.gif'" onmouseout="this.src='images/about/icon-milk.png'"/></a></li>
    </ul>`

Заранее спасибо!

редактировать Я проверил отчеты об изображениях IE8 и, по-видимому, установил ширину и высоту моих изображений на 0 пикселей. Я понятия не имею, почему это произошло :| и я понятия не имею, как это исправить


person Libre    schedule 10.07.2012    source источник


Ответы (1)


Я думаю, что это может быть ошибка в IE с JavaScript. Возможным решением было бы загрузить изображение, а затем переключить видимость анимации с помощью JavaScript?

person Neojames    schedule 10.07.2012
comment
Спасибо! Но, к сожалению, это не ошибка javascript :( Я попробовал то, что вы рекомендовали, и изображения по-прежнему отсутствуют. Я проверил инструменты разработчика (отчеты об изображениях) и, по-видимому, IE8 автоматически перенастраивает мою высоту и ширину на 0 пикселей по сравнению с их первоначальными размерами. Я' я не уверен, почему это произошло, в частности, в IE8 - person Libre; 10.07.2012
comment
Ах! Попробуйте настроить IE8 в режиме причуд. - person Neojames; 10.07.2012
comment
Спасибо :) изображения наконец-то загружаются, но они повсюду, ха-ха. Казалось бы, добавление !important ко всем объявлениям css, связанным с этими шестью в отдельном файле css, работает, но не знаю, почему это не сработало, когда я добавил !important в основной файл css. - person Libre; 10.07.2012
comment
:D Рад, что ты нашел решение! Я думаю, что IE8, должно быть, думает, что знает лучше, и по какой-то причине переопределяет вас... - person Neojames; 10.07.2012