在draggable上将GIF动画：jquery

问题描述

| 我正在寻找利用jQuery的UI插件创建类似于此jsfiddle的draggable（）和droppable（）行为。唯一的区别；我希望购物车在激活draggable（）时通过动画播放，以使用户可以放下物品的地方更明显。 但是，我所需的动画无法通过CSS完成，它是图像本身的动画。我既有动画的GIF，也有等效的JPEG序列，以效果最佳者为准。实现这一目标的最优雅的方法是什么？ 仅供参考：该代码来自Michael Abernethy的IBM developerWorks文章。     

解决方法

        您可以为draggable \的

start

事件添加回调以更改购物车图片的

src

属性，然后添加

stop

回调以将其更改回。 实时示例：http：//jsfiddle.net/ambiguous/yM9s5/6/ 另一种方法是： 用

<div>

替换

<img>

下降目标。 通过CSS调整

<div>

的大小以匹配

<img>

。 向

<div>

添加背景图像以匹配

<img>

的视觉效果。 在您的

border

类中添加

background-image

并将该图像设置为动画GIF。 例如：http://jsfiddle.net/ambiguous/yM9s5/5/ 这应该与动画GIF一起使用，但是我没有一个方便的检查方法。