鼠标悬停上的jQuery幻灯片面板

Question

如何使此滑动面板示例在鼠标悬停时向下滑动并在鼠标移动时向后滑动而不是使用单击功能？

请参阅此处的示例：http://www.webdesignerwall.com/demo/jquery/simple-slide-panel.html

$(".btn-slide").click(function(){
    $("#panel").slideToggle("slow");
    $(this).toggleClass("active"); return false;
});

Answer 1

使用hover功能。这应该很接近。

function slide() {
  $("#panel").slideToggle("slow");
  $(this).toggleClass("active"); 
  return false;
}

$(".btn-slide").hover(slide, slide);

Answer 2

您可以执行类似

的操作

$（ “＃滑块”）。悬停（  功能（）{        $（ “＃滑块”），停止（）动画（{左： “ - 为200px”}，{队列：假的，持续时间：300}）;  }，  function（）{       。$（ “＃滑块”），停止（）动画（{左： “0像素”}，{队列：假的，持续时间：300}）;  }）;