0

根据线程标题,我对 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 中看到闪烁。如果没有文本覆盖,问题就不会发生,这说明了这一点。

任何帮助都将非常感激,因为我的最后期限很紧

亲切的问候和感谢,

ps 这是我的标记:

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

2 回答 2

0

通常,闪烁是由于您将悬停在悬停状态下从鼠标下方移出的字符上匹配引起的。IE 的神奇技巧是字符之间的“背景”不算作字符——你实际上必须在一个字母上。考虑将悬停连接到包含此文本的 div,并确保在悬停状态下不会移动或被遮挡。

于 2012-05-24T16:17:57.703 回答
0

如果您在 Internet Explorer 中的树形视图底部出现闪烁问题,请确保您的文档属于以下类型:

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

当我使用以下内容时:

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

使用该文档类型时,Internet Explorer 7 会闪烁动画。如果您不知道闪烁的原因,那么解决此问题可能需要很长时间 :-)

于 2013-09-26T09:56:04.620 回答