ошибка jQuery hover fliker с IE 7/8

Согласно заголовку темы, у меня небольшая проблема с IE 7/8, когда, когда вы наводите курсор на миниатюру, она мерцает. Мой код выглядит следующим образом: -ошибка jQuery hover fliker с IE 7/8

function activateThumbnails(intThumbActiveOp, intThumbInActiveOp, intFadeTime,  strThumbClass) 
{ 
    //Hide image title 
    jQuery("a " + strThumbClass).attr('title', ''); 

    //Bind effect to post thumbnails.. 
    jQuery(window).bind("load", function() { 
     var activeOpacity = intThumbActiveOp, 
      inactiveOpacity = intThumbInActiveOp, 
      fadeTime = intFadeTime, 
      clickedClass = "selected", 
      thumbs = strThumbClass; 

     jQuery(thumbs).fadeTo(1, inactiveOpacity); 

     //Animate thumbnail on hover event.. 
     jQuery(thumbs).hover(
      function(){ 
       //Fade into thumbnail.. 
       jQuery(this).fadeTo(fadeTime, activeOpacity, function(){ 
        //Display Preview Body once faded in 
        intId = jQuery(this).closest('div').attr('id'); //Get parent DIV ID 
        jQuery('#previewId' + intId.substr(6)).show(); 
       }); 
      }, 
      function(){ 
       // Only fade out if the user hasn't clicked the thumb 
       if(!jQuery(this).hasClass(clickedClass)) 
       { 
        //Fade out of thumbnail.. 
        jQuery(this).fadeTo(fadeTime, inactiveOpacity, function(){ 
         //Hide Preview Body once faded out 
         intId = jQuery(this).closest('div').attr('id'); //Get parent DIV ID 
         jQuery('#previewId' + intId.substr(6)).hide(); 
        }); 
       } 
      }); 

     jQuery(thumbs).click(function() { 
      // Remove selected class from any elements other than this 
      var previous = jQuery(thumbs + '.' + clickedClass).eq(); 
      var clicked = jQuery(this); 
      if(clicked !== previous) 
      { 
       previous.removeClass(clickedClass); 
      } 
      clicked.addClass(clickedClass).fadeTo(fadeTime, activeOpacity); 
     }); 
    }); 
}

Пожалуйста, обратите внимание, я кладя некоторый предварительный просмотр текста над парения изображений, и, когда курсор находится над текстом предварительного просмотра (не само изображение), что вы получите мерцание IE 7/8. Это иллюстрируется тем, что проблема не возникает, если нет текстового оверлея.

Любая помощь будет очень высоко ценится, как я в сжатые сроки

С уважением и спасибо,

пс вот моя разметка:

<div id="postId" class="postContainer"> 
<!-- Post Preview canvas --> 
<div id="previewId" class='postPreview'> 
    <!-- Post preview Title --> 
    <div class="previewTitle"> 
     some title 
    </div> 
    <!-- Post preview Body --> 
    <div class="previewBody"> 
     some text body 
    </div> 
</div> 
<a href="#"> 
    some thumbnail 
</a> 
</div>

источник

2012-05-24 Matt

Обычно мерцание вызвано вы соответствуете паре над символом, который перемещается из-под мыши в зависающем состоянии. Интересный трюк IE заключается в том, что «фон» между персонажами не считается символом - вы на самом деле должны быть на букве. Подумайте о том, как подключить наведение к div, который содержит этот текст, и обязательно не перемещаться или скрываться в зависании.

источник

2012-05-24 16:17:57 robrich

Heya Robrich, спасибо за ваш ответ. Я рассмотрел возможность размещения изображения (например, миниатюры выше) и текстового наложения (#previewid) в том же контейнере, но это повлияло на то, что текстовое оверлейное изображение было таким же бледным, как изображение находится в состоянии зависания (я надеюсь, что это делает смысл – Matt

Это имеет смысл и предполагает, что css, который заставляет его исчезать, должен быть более жестко привязан. – robrich

Привет, робрих, я сделал то, что вы сказали, и это имело желаемый эффект - однако во всех браузерах, кроме IE, текстовый Наверное, все версии IE теперь работают так, как я хотел! :) – Matt

Если у вас есть проблемы с мерцающим в нижней части TreeView в Internet Explorer, то убедитесь, что ваш документ имеет тип:

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” 
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”> 
<html xmlns=”http://www.w3.org/1999/xhtml”>

Когда я использовал следующее:

<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Frameset//EN”> 
<html>

Интернет Explorer 7 мерцает анимацию, когда используется этот doctype. Если вы не знаете, что вызывает мерцание, это может занять много времени времени, чтобы решить эту проблему :-)

источник

2013-09-26 09:56:04 ron

ошибка jQuery hover fliker с IE 7/8

ответ

Смежные вопросы