javascript - Jquery定时器滑动功能

Question

现在我有一个 div，可以从右向左滑动，然后反之亦然回到原来的位置。但总的来说，这并不是我真正想要的工作方式。我的主要目标:是让用户将鼠标悬停在主 div 上，然后拉出滑动 div。棘手的部分如下:如果用户忘记将潜水器向后滑动，我想给它一个时间范围，使其在经过一定时间后自动关闭。这是到目前为止我的工作代码:jsfiddle.net/eMsQr/14/ .

我的 JavaScript 函数:

$(document).ready(function() {
  $("#arrow").hover(
    function(){
      $("#inner").stop().animate({marginRight: "0px", opacity: "1px", height: "100px"}, 500 );
    },
    function(){}
  );
});


$("#arrow").click(function(e){
    $("#inner").stop().animate({marginRight: "-100px", opacity: "1px", height: "100px"}, 500 );
});

Answer 1

试试这个:http://jsfiddle.net/vansimke/cJ5pf/

我连接了 mouseleave 事件并添加了 setTimeout。如果您稍后需要取消它(即他们重新输入箭头)，您可能需要捕获超时