我正在尝试使用自定义拖动图像实现HTML5拖放，该图像显示在光标后面。这可以使用setDragImage完成，并且可以与独立图片配合使用，即使用new Image创建。
但是，为了提高页面加载速度，我想将这些图像组合成一个图像，使用精灵和background-position技巧。
要实现在setDragImage拖放功能中使用的精灵，可以将元素用作拖动图像这一事实非常方便：创建<div>，设置其大小和背景图像和位置，并将div传递给setDragImage。
但是，似乎这些图像必须在DOM中可见。当您使用DOM元素调用setDragImage时，看起来像元素的“屏幕截图”，当元素被隐藏或不是DOM的一部分时，屏幕截图为空，因此没有图像在拖动时显示。
请查看this fiddle。拖动两个文本div可以正常使用拖动图像。但是，单击按钮隐藏图像div后，拖动文本div不会再显示拖动图像。
我只需要在谷歌浏览器上使用它。
如果在包含精灵作为背景图像的setDragImage隐藏或不隐藏在DOM中，我如何使用带有HTML5拖放（div）的精灵图像？或者，是否有另一种使用精灵setDragImage的技术？
答案 0 :(得分：1)
如果我是你，我会删除精灵并使用内联base64编码图像。如果您只想提高页面加载速度并跳过请求开销，那么它应该可以正常工作，并且您应该解决问题：）