HTML/CSS 悬停时根据鼠标位置动画 Gif(或视频)

HTML/CSS to Animate Gif (or video) on Hover based on mouse position

我想知道是否有一种方法可以根据我的鼠标相对于框架的悬停位置来制作 gif 或视频的动画。

我认为我的意思最好的例子是,如果 gif 是某人 360 度转身,我希望当鼠标位于框架左侧时该人面向前方,当鼠标位于框架左侧时转身在框架的中央,在框架的右侧(以及所有中间部分)再次面向前方。

有效地使用鼠标悬停作为视频时间轴的拖动功能

如果您有任何想法或需要更多详细信息,请告诉我。

如果需要,我可以上传一些例子gifs/videos来阐明我的目的。

提前谢谢大家。

您可以在 CSS 中的 class 上使用 transform: rotate()

这里是demo.