IE8 jQuery текст меняется на Z-индекс Div - PullRequest
Новая
       4

IE8 jQuery текст меняется на Z-индекс Div

1 голос
/ 04 сентября 2010

Я использую плагин jQuery Cycle для циклического перемещения по изображениям на веб-странице.

Каждое изображение также имеет различные метаданные (заголовок, описание), которые также отображаются на странице. Всякий раз, когда изображение изменяется, текст заголовка и описания также изменяется на заголовок и описание этого изображения. 

<div id='slides'> 
    <a href="http://whatever.com">
         <img src="http://localhost/wordpress/wp-content/uploads/2010/09/slide1.jpg"/>
    </a>
    <a href="http://somewhere.com">
        <img src="http://localhost/wordpress/wp-content/uploads/2010/09/slide2.jpg"/>
    </a>
    <a href="http://nowhere.com">
         <img src="http://localhost/wordpress/wp-content/uploads/2010/09/slide3.jpg"/>
    </a>
</div> 
<div id='slideshow_text'> 
    <div id='ss_title'>The title goes here</div> 
    <div id='ss_desc'>The description goes here</div> 
</div>

JavaScript довольно прост: 

jQuery(document).ready(function(){
    jQuery('#slides').cycle({
        fx:         'fade',
        speed:      1000,
        timeout:    10000,
        after:     alterSlideText,
    });
});

Функция alterSlideText javascript очень проста. В основном это просто запустить это: 

jQuery('div#ss_title').html(slides_array[slideNum]['title']);
jQuery('div#ss_desc').html(slides_array[slideNum]['desc']);

slides_array - это просто массив заголовка и описания для каждого слайда. Таким образом, в зависимости от того, какой слайд отображается в данный момент, он выбирает соответствующий заголовок и описание для вставки в div.

Так что в целом настройка очень проста и понятна. Изображение меняется. Тогда текст изменится.

Теперь проблема - Это все прекрасно работает в Moz и Webkit. Но в IE текст div не изменится, пока я не наведу указатель мыши на slides div или slideshow_text div. Текст просто не изменится, если я просто оставлю его там. Как только я наведу указатель мыши на этот элемент, он будет изменен на соответствующий текст.

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

Кто-нибудь знает, почему это так и как это исправить?

1 Ответ

1 голос
/ 04 сентября 2010

Я исправил это, добавив в конец функции alterSlideText следующее: 

// Force IE to refresh itself
jQuery('div#slides').blur();
jQuery('div#slides').focus();

Отличная работа разработчиков IE.Найди другую работу.

...