Question

所以基本上，我正在使用jquery进行翻转。我有一个常规的html包装缩略图，里面有一个图像。然后对于翻转，我动态附加一个div（以便稍后设置翻转动画），并在该动态附加的div中，我希望alt文本在屏幕上显示为实际文本。在推出时，它隐藏了它。

这是基本的html

<div id="portSecW">

                <div class="portThumbsL">
                     <a href="images/sitePortThumbs/2882.png"><img src="images/sitePortThumbs/2882.png" alt="2882films"/></a>
                    <div class="thumbTxtSmall">2882FILMS</div>
                </div>

    </div>

这里是javascript

$('#portSecW div:not(".closeXbtn")').prepend('<div class="portSecRollOver"><div class="portSecInner"></div></div>');


    $('.portThumbsL , .portThumbsR, .portSecRollOver, .portSecInner, h3').mouseover(function(){
        //$(this).css("background-color","#0099FF");//blue bg for thumgs
        $(this).children('.portSecRollOver').css("display","block");
        //$(this).children('.portSecRollOver').show();
        $(this).find('.portSecInner').html("<h3 class='h34roll'>" + $(this).find('img').attr("alt") + "</h3>");

    });
////    
    $('.portThumbsL , .portThumbsR').mouseleave(function(){
        //$(this).css("background-color","#333");
        $(this).children('.portSecRollOver').css("display","none");
        //$(this).children('.portSecRollOver').hide();
    });

现在问题在于，问题在于虽然一切正常，但在鼠标输出时它有时会卡住。搞砸了我发现如果你像往常一样滚动，将鼠标放在中间的文本上，并水平滚动（左/右）附加的div不会隐藏自己。它只是停留在屏幕上。无论我做了什么，如果你鼠标悬停在div的顶部或底部区域，它就会起作用，只要你将鼠标放在文本所在的位置，它就会卡住。

这是一个jsFiddle，所以你们都可以看到发生了什么。再次，鼠标悬停在框中，你会看到中间的文字（由alt标签提供），将鼠标放在那里并水平滚动（左//右），看看它是如何停留在那里的。如果你然后将它鼠标悬停在顶部/底部部分上，那么它的行为就像正常一样。

在上面的jQuery选择器中，香港专业教育学院把每个选择器都放在那个盒子里，我首先尝试了它们，所有这一切都是自己完成的，然后就像我上面所有的一样，我只是不会让那些搞砸我。

继承人jsFiddle http://jsfiddle.net/somdow/KSt6a/

先谢谢。

Answer 1

$('.portThumbsL').hover(function(){        
    $(this).children('.portSecRollOver').css("display","block");
    $(this).find('.portSecInner').html("<h3 class='h34roll'>" + $(this).find('img').attr('alt') + "</h3>");
}, function() {
    $(this).children('.portSecRollOver').css("display","none");
});

我不熟悉mouseover和mouseleave方法，但是对于相同的情况，我使用hover与两个处理程序在＆amp;进行。

Answer 2

将复杂代码简化为简单的CSS：hover语句？

http://jsfiddle.net/5jYem/

jquery翻转/定位/选择器问题

2 个答案: