使用Angular4水平滚动div

Question

我有以下HTML代码：

{{1}}

这就是它在移动设备上的样子：

我想创建一个自动水平滚动到最后一个制造商的动画，但在用户与之交互时停止。

换句话说：

1. 用户打开页面，看到自动滚动
2. 用户明白这是一个滚动的div，开始用手指滚动。
3. 页面上已禁用自动滚动（直到用户重置页面状态）

我遇到麻烦的地方：

1. 如何使用javascript自动滚动？ （理想情况下，我想控制在一个时间范围内滚动多少像素，例如50px /秒）
2. 如何检测用户何时与卡片组合＆＃34;卡片组＃34; div（如手势：触摸，滑动等）

Answer 1

1）自动滚动：您可以使用JS函数setInterval来更改每个x mS div的位置。

2）您可以使用@HostListener注释（See Angular doc）来监视用户交互，并在触发click事件时使用JS函数clearInterval取消setInterval