Question

根据主题标题，我对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中获得闪烁。事实证明，如果没有文字覆盖，问题就不会发生。

在紧迫的截止日期之前，我们非常感谢任何帮助

亲切的问候和谢谢，

p.s这是我的标记：

 <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>

Answer 1

通常，闪烁是由将鼠标悬停在悬停状态下从鼠标下移出的角色上引起的。 IE的奇妙伎俩是角色之间的“背景”不算作字符 - 你实际上必须在一封信上。考虑将悬停连接到包含此文本的div，并确保在悬停状态下不移动或遮挡。

Answer 2

如果您在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>

使用该doctype时，Internet Explorer 7会闪烁动画。如果你不知道闪烁是什么导致它可能需要很多解决这个问题的时间： - ）

jQuery悬停与IE 7/8的闪烁错误

2 个答案: