不同元素上的Jquery单击并悬停事件是否会影响同一元素不工作？

我对以下代码有问题

$(document).ready(function(){
  $('#icon2').click(
  function(){ $('#st1').animate({top:'-10px'},500);}
  );
  $('#down1').hover(
  function(){ $('#st1').stop(true, false).animate({bottom:'+=250px'},10000,'linear');}, 
  function(){ $('#st1').stop(true, false).animate({bottom:'-=0px'},10000,'linear');}
  );
});

从下图来看

#down1是文本下方的向下箭头

#icon2是关于图标

我试图实现的是，当我在向下箭头上悬停时，文本应该向下滚动，当我鼠标移出时，滚动应该停止。当我点击about图标时，文本应该会滚动回到默认位置

但这里的问题是，只有一种效果可以使用鼠标悬停或单击，但不能同时使用这两种效果

如果可能的话，请详细解释我做错的地方

---

jsfiddle:

显然你犯了一个小错误

试试这个

$(document).ready(function(){
  $('#icon2').click(
  function(){ $('#st1').stop(true, false).animate({bottom:'0px'},500);}
  );
  $('#down1').hover(
  function(){ $('#st1').stop(true, false).animate({bottom:'+=250px'},10000,'linear');}, 
  function(){ $('#st1').stop(true, false).animate({bottom:'-=0px'},10000,'linear');}
  );
});

我刚刚将动画

顶部

更改为动画

底部

。在悬停中，您设置了底部样式，因此您实际上应该在“关于”单击上执行相同的操作。否则，底部位置将仍然存在。我会对此进行测试，但我不能，因为您只向我提供了原始代码页；）

实际上，这是可行的：

---

（编辑：更改了源代码中的ops注释）

您能添加一个JSFIDLE吗？还是一个片段？我不想看到实时代码。。。我想有一个平台，在那里我可以添加一些东西，也许可以为你提供一个解决方案：）我不需要周围的东西：）@Dwza你的动画不是真的在你提供的小提琴上运行。检查一下这把小提琴，把它调好：我把它改成了up，这是jfiddlet。但还是不行！：（是的，它可以工作，并通过添加单击功能停止（true、false）来避免延迟