Question

我有一些具有悬停效果的元素，以及单击时应该选择的元素。目前，当我将stop()添加到效果时，会导致动画在单击时停止。我尝试使用fadeToggle()获得相同的效果，但无法解决如何让它正常运行。我定位的id会传递到点击元素的href。

有人可以指出编写此脚本的最佳方法吗？

$(function() {
    $("#map-hovers > ul > li").hide();
    $('area').click(function(e) {
        e.preventDefault();
        var $hoodClick = $($(this).attr('href'));
        if ($hoodClick.hasClass('selected')) {
            $($hoodClick).fadeOut().removeClass('selected');
        } else {
            $($hoodClick).fadeIn().addClass('selected');
        }
    }).hover(function() {
        var $hoodHoverOver = $($(this).attr('href'));
        $hoodHoverOver.fadeIn();
    },
    function() {
        var $hoodHoverOut = $($(this).attr('href'));
        if ($hoodHoverOut.hasClass('selected')) {
            } else {
            $hoodHoverOut.fadeOut();
        }
    })
});

Answer 1

使用.stop(true, true)。它会跳到动画的结尾。清除动画队列。在API中了解有关它的更多信息：http://api.jquery.com/stop/

结合切换和悬停的最佳实践

1 个答案: