Jquery 动画不'；在Chrome中不透明度转换完成之前，t开始

我制作了一个简单的放大镜效果：。它是一个与

源代码具有相同背景的div，当鼠标悬停在图像上时，它会根据指针位置更改其位置。没什么太复杂的。在Fiddle中，它在支持

指针事件的浏览器中运行良好：无（其余部分不会使它消失，但这不是现在的问题）

问题是，在Chrome中，它只在代码位于
内部时才起作用，就像在小提琴中一样。如果不是，就像这里：，放大镜的背景只有在不透明度转换完成后才会移动。我把它设为1.5秒，这样更容易注意到。同样奇怪的是，当我将光标从图像顶部开始悬停时，它部分工作

有什么问题吗？除了将代码放在iframe中，还有其他解决方案吗？我试着修改js，它可以与jQuery一起使用
fadeIn（）/fadeOut（）
，但在这种情况下，我更愿意使用CSS中的不透明转换

您可以随意更改标题，使其更有意义：）