jQuery ошибка исчезновения / появления прозрачных изображений в IE8 - PullRequest
Новая
       18

jQuery ошибка исчезновения / появления прозрачных изображений в IE8

0 голосов
/ 31 мая 2011

Последние 4 часа я провел, пытаясь реализовать все исправления IE8 для прозрачных изображений.К сожалению, ни один из них не работает.

Вот URL-адрес тестирования: http://www.bluegrassbackingtracks.com/stage/

Вы можете видеть, что при прокрутке значков в IE8 к изображениям добавляется черная рамка.

Я был бы очень признателен всем, кто может нам помочь.

Ответы [ 3 ]

1 голос
/ 31 мая 2011

Эта проблема больше связана с jQuery и проблемой прозрачности fadeIn / Out с IE.

Проверьте это для справки: jquery IE Fadein и Fadeout Opacity

Дляпомогая IE, если вы можете поместить изображение внутри div и применить вместо него fade к div, вы должны получить эффект, который вам нужен.Могут быть проблемы с прозрачностью, когда выцветание применяется к фоновому изображению.

Попробуйте что-то подобное.Вам также нужно будет немного настроить свой jQuery. 

<ul class="img_list">
    <li class="image_two">
        <a href="category.php?id=2">
            <div class="overlay"><img src="images/buttontwo-overlay.png" alt="" width="136" height="176" /></div>
            <img src="images/buttontwo.png" alt="" width="136" height="176" />
        </a>
    </li>
</ul>
0 голосов
/ 11 июля 2011

Определите сплошной цвет фона для вашего изображения: 

    .container img {
         background-color: white;
    }

Определите свойство background-image css вашего изображения для его атрибута src : 

    $('.holder-thumbs li a img').each(function() {
         $(this).css('background-image', $(this).attr('src'));
    });

Преимущество: вам не нужно менять разметку

Недостаток: иногда применение сплошного фона не является приемлемым решением. Это обычно для меня.

0 голосов
/ 31 мая 2011

На этом сайте нужно пройти много кода, если бы вы могли разместить соответствующий код здесь, было бы намного легче понять, в чем проблема.

До тех пор это может решить вашу проблему: 

var i;
for (i in document.images) {
    if (document.images[i].src) {
        var imgSrc = document.images[i].src;
        if (imgSrc.substr(imgSrc.length-4) === '.png' || imgSrc.substr(imgSrc.length-4) === '.PNG') {
            document.images[i].style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='crop',src='" + imgSrc + "')";
        }
    }
}

Поместите это в $(function () {});, и он должен добавить фильтр к каждому изображению, чтобы непрозрачность не испортила и не произвела черный цвет.

Если это не сработает, взгляните на: Цикл jquery Проблема прозрачного png IE7 .

...