0

我想显示几个blocks（div）并让它们都以相同的方式与同一个对象交互。

这是一个jsFiddle 演示

模拟错误的步骤

  1. Rollover第一个块将触发动画，它会打开对象。
  2. 然后，如果您Rollover是第二个块，我想让对象保持打开状态，但是会发生第一个对象关闭然后再次打开的情况。

客观的

在我翻转积木时保持物体打开

为后代添加了原始代码：

$('.object').css({ "top": '-180px' });
$(".cont1,.cont2").hoverIntent(mousein_triger , mouseout_triger);

function mousein_triger(){
        $('.object').stop().animate({"top": "0px"}, 300);
    }
function mouseout_triger() {
        $('.object').stop().animate({"top": "-180px"}, 1000);
}
4

2 回答 2

1

我使用了一个计时器（全局）这里是 jsfiddle：http: //jsfiddle.net/zL5jZ/

var timer = false;
function mousein_triger(){
        clearTimeout(timer);
        $('.object').stop().animate({"top": "0px"}, 300);
    }
function mouseout_triger() {
        timer = setTimeout(function(){
            $('.object').stop().delay(1000).animate({"top": "-180px"}, 1000);
        }, 400)
}

在没有悬停块的情况下 400 毫秒后，块会自行关闭，否则它会按照您的意愿保持打开状态。

我对吗 ？:)

于 2013-01-03T19:42:19.203 回答
1

解释为什么它不起作用...

问题是“stop()”将停止动画，如果它已经开始，但如果它正在进行，则不会停止延迟。因此，如果您移出一个盒子并等到蓝色的开始移动并快速移回一个盒子，它将立即停止动画。如果你从一个盒子里移出然后又回到一个盒子里，它会完成等待，然后完成整个动画。

要修复它，请使用@nicolast 建议的计时器。

于 2013-01-03T19:48:58.243 回答