Internet Explore 8 не изменит src изображения с помощью .attr()

Я настроил страницу, которая будет пролистывать последовательность изображений, когда пользователь прокручивает их с помощью мыши или трекпада. Я использую jQuery для измерения расстояния от верхней части страницы - scrollTop() - чтобы затем изменить источник изображения для определенного идентификатора в DOM.

Это отлично работает в Firefox, Chrome, Safari, Opera, IE9, а также на iPad, iPhone и т. д. ОДНАКО, это не работает в IE8.

Это HTML:

<div id="flipping-container">
    <img id="flipping-id" class="flippingTarget" src="imageOne.png" alt="imageone" />
</div>

Это JS:

$(document).scroll(function() {
    var toTop = $(document).scrollTop();
    if (toTop <= 340) {
            $('.flippingTarget').attr('src','imageOne.png');
    }
    else if ((toTop <= 392) && (toTop > 341)){
            $('.flippingTarget').attr('src','imageTwo.png');
    }
    else if ((toTop <= 445) && (toTop >= 393)){
            $('.flippingTarget').attr('src','imageThree.png');
    }

// AND SO ON
// ENDING WITH...

    else {
            $('.flipping-target').attr('src','image1.png');
    };
});

Идентификатору div "flipping-container" присваивается значение CSS position:fixed; так его всегда видно.

Я пролистал сообщения StackOverflow и пока не смог найти работающее решение. Значение scrollTop() читается отлично, так как у меня есть события нажатия на кнопки, которые плавно прокручивают страницу до div и/или нескольких пикселей сверху. IE8 в порядке с этим, так что это не проблема html/body/document/window scrollTop().

Я заменил значение .attr() на .addClass(), чтобы посмотреть, будет ли оно подхвачено. Но это не в IE8. Таким образом, это может быть не связано напрямую с самим атрибутом src. Я дважды проверил имена и цели своих классов, и все они в порядке (также доказано, что другие браузеры работают по назначению).

Любые подсказки? Любая помощь приветствуется.


jquery src internet-explorer-8 scrolltop
person Tim Dodd    schedule 24.08.2012    source источник
comment
Это пример функции плавной прокрутки, которая использует scrollTop и работает в IE8... $(document).scroll(function() { $('.button-target').click(function(e){ e.preventDefault (); $(html:not(:animated),body:not(:animated)).animate({scrollTop:3240}, 3000); }); });   -  person Tim Dodd    schedule 24.08.2012
comment
Эта ссылка может содержать ответ, который вы ищете stackoverflow.com/questions/9644199/   -  person Ravi    schedule 24.08.2012
comment
Спасибо за ваш комментарий, Рави. Чтобы использовать две основные темы на этой странице, она обернута в состояние готовности документа, и, к сожалению, предварительная загрузка/кэширование изображений недоступна для этого пакета. Последовательность содержит 40 больших PNG-файлов с прозрачным фоном. Боюсь, нужна предзагрузка и кеширование браузером.   -  person Tim Dodd    schedule 24.08.2012
comment
Я добавил предупреждение при нажатии div на экране, которое показывает значение scrollTop. Значение равно 0 во всех браузерах (не только в IE8, но и в тех, где приведенный выше код работает и распознает значение scrollTop и изменяет атрибут изображения src).   -  person Tim Dodd    schedule 24.08.2012