Question

我正在创建一个简单的网页作为我的计算机分配的一部分，我决定在其中包含一些jQuery。它非常简单的jQuery，如下所示：

    $(document).ready(function() {
$( "#dialog" ).dialog({
    modal: true,
    height: 410,
    width: 500,
    resizeable: true,
    });
$('#credits').hide();
$('#doctor_seuss_info').hide();
$('#title').hover(function() {
    $('#credits').show('slow')
    });
$('#title').mouseleave(function() {
    $('#credits').hide('slow');
    });
$('#doctor_seuss_title').hover(function(){
    $('#doctor_seuss_info').show('slow');
    });
$('#doctor_seuss_title').mouseleave(function(){
    $('#doctor_seuss_info').hide('slow');
    });
$('#other_poems').accordion();
$('#doctor_seuss_fish').click(function() {
    $(this).animate({'marginLeft' : '-60em'}, 5000);
    });
});

我遇到的问题是网站很难导航，因为如果你移动鼠标太快，一切都会移动。如何添加对象移动次数的限制？

Answer 1

您应该尝试查看hoverIntent：http://cherne.net/brian/resources/jquery.hoverIntent.html

这似乎是您正在寻找的完美解决方案，因为它只会在鼠标悬停一段时间后触发该功能。

Answer 2

应该更好：

悬停鼠标中心/鼠标的简写，你的代码没有按预期工作

$(document).ready(function () {
    $("#dialog").dialog({
        modal: true,
        height: 410,
        width: 500,
        resizeable: true,
    });
    $('#credits, #doctor_seuss_info').hide();
    $('#title').hover(function () {
        $('#credits').stop().toggle('slow')
    });

    $('#doctor_seuss_title').hover(function () {
        $('#doctor_seuss_info').stop().toggle('slow');
    });

    $('#other_poems').accordion();
    $('#doctor_seuss_fish').click(function () {
        $(this).stop().animate({
            'marginLeft': '-60em'
        }, 5000);
    });
});

jQuery限制动画的数量

2 个答案: