这是一种使用 HTML 和 CSS 创建的简单而惊人的动画效果，其中照片像滚轮一样一张一张地水平移动。当鼠标指针出现在照片上时，特定照片将停止移动。
方法：这些动画的基本思想来自于CSS动画的悬停效果。让我们看看代码是如何工作的。
HTML 代码：照片将使用 HTML 在圆环中移动。为了创建动画，我们使用了一个“div”和一个部分来正确维护照片的区域，并且在 CSS 代码中使用了类名。我们为将在页面中显示的照片使用了 HTML图形和img 标签。
HTML
CSS
HTML
CSS 代码：让我们谈谈代码的 CSS 部分。使用了一些基本属性，如边距、填充、位置、浮动、边框、动画等，这将帮助照片为它们提供正确的位置。它有助于在 2D 中旋转照片。首先它绕着自己的轴旋转。然后整个“div”围绕其轴旋转。
要创建此动画，请使用figure:nth-child(“no. of child”)属性。 transform:rotateY(amount of deg)和translateZ(–px)是 CSS 的两个属性，有助于旋转对象。
CSS
最终代码：在本节中，我们将结合以上两节（HTML 和 CSS）代码。
HTML
输出：
