Блог

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

Проще говоря, следующее работает во всех браузерах, которые я тестировал, кроме IE6:

 var bg = $('.element_selector').css('background-image');
  

Возвращаемое значение из IE6 равно ‘none’, что неверно. (Прежде чем кто-либо предложит попробовать ‘BackgroundImage’ вместо ‘background-image’, без кубиков.)

Есть идеи о том, как я могу получить это значение?

Обновление: я забыл упомянуть, что рассматриваемое фоновое изображение было обработано DD_belatedPNG, который теперь, похоже, является виновником — если я закомментирую исправление, я получу свое значение. Если кто-нибудь знает, как я все еще могу получить это значение после исправления png, пожалуйста, дайте мне знать.

После некоторого тестирования в IE6 я смог воспроизвести вашу проблему с DD_belatedPNG и фоновым src.

Вот что я нашел. Если вы установите background-image переменную перед вызовом DD_belatedPNG.fix('[selector]'); , то получите желаемый результат. Если вы устанавливаете его позже, например, в click событии, вы получаете значение "none" .

Кроме того, DD_belatedPNG добавляет элемент image на страницу, содержащую ваше фоновое изображение (с классом DD_belatedPNG_sizeFinder ), так что вы потенциально можете 1) повторно использовать, 2) скопировать или 3) взять src значение атрибута из этого элемента.

Вот мой тестовый код:

CSS:

 #myElement
{
    width: 515px;
    height: 341px;
    margin: 100px auto;
    background: #f00 url('http://www.chismbrothers.com/images/woodfloors.png') no-repeat 0 0;
}
  

HTML:

 <div id="myElement"></div>


<div id="test1"></div>
<div id="test2"></div>
<div id="test3"></div>
<div id="test4"></div>
  

jQuery:

 $(document).ready(function() {
    // Works as expected
    var bg = $('#myElement').css('background-image');
    $('#test1').text("pre png fix: "   bg);

    DD_belatedPNG.fix('#myElement');

    $('#myElement').click(function() {
        var bg = $(this).css('background-image');
        var bgAll = $(this).css('background');

        // This yields values of 'none' for bg and 'undefined' for bgAll
        $('#test2').html("post png fix: "   bg   "<br />bg: "   bgAll);

        // DD_belatedPNG creates an image element on the page with a class of 
        // 'DD_belatedPNG_sizeFinder' which can be used to get the image src
        $('#test3').html('dd_belatedpng_sizeFinder: '   $('.DD_belatedPNG_sizeFinder').attr("src"));

        // Perhaps reapplying 'zoom' css will reapply the BG values?
        $(this).css({ zoom: 0 }).css({ zoom: 1 });
        // Set values again.
        bg = $(this).css('background-image');
        bgAll = $(this).css('background');
        // No luck...same result as #test2
         $('#test4').html("post png fix: "   bg   "<br />bg: "   bgAll);
    });
});
  

1. Вы пробовали background ?
2. Вы уверены, что элемент правильный?