我正在尝试创建一个类似于pango.co.il.上的圆形滑块/旋转木马，但是，在实现所需的设计和功能方面我面临着挑战。
具体来说，以下是我面临的问题：
1.幻灯片并没有排列成一个完美的圆圈。
1.活动幻灯片未居中，并且比其他幻灯片大。
1.上一张和下一张幻灯片的位置不会稍远，也不会按比例缩小。
1.圆形布置的旋转和透视效果不如预期。
我在CodeSandbox上创建了一个演示来展示我当前的实现：Link to Demo
Desired Carousel在图片中，您可以看到来自Pango.co.il的圆形滑块/转盘的理想外观。我想在我的实现中实现类似的设计和功能。
我将感谢任何修改代码的指导或帮助，以实现与pango.co.il上的非常相似的圆形滑块/旋转木马。也欢迎对替代方法或库的建议。
提前感谢您的帮助！
1条答案
按热度按时间gj3fmq9x1#
这是一个复杂的问题，因为它是关于一个复杂的UI：）
但是，我会沿着以下几条准则：
1.考虑一个状态管理逻辑，它允许维护选项和当前选择的选项的顺序。
1.如果期望的结果是圆周运动，
transform: rotate()可能是最直接的实现。1.挑战将是保持所有选项水平（即平行于屏幕视图）。想一个方法来保持每个选项的Angular 。
1.一旦其余部分正常工作，中心部分将很容易实现。
祝你好运！