Javascript 将水平滚动条添加到带有动画的图像中？

我如何添加一个水平滚动条，以便在用户调整浏览器窗口大小时（我需要它，尤其是在移动设备上！），用户可以水平滚动以查看完整图像，并在他们悬停、滑动时暂停动画

我用这个在我的家庭网站上拍家庭照片。这是否可以通过CSS实现，如果不可以，是否可以通过Javascript实现？

@关键帧动画背景{
从{
背景位置：0；
}
到{
背景位置：100%0；
}
}
#动画区域{
宽度：200px；
高度：200px；
背景图片：url(https://github.githubassets.com/images/modules/open_graph/github-mark.png);
背景位置：0px 0px；
背景重复：重复-x；
动画：动画背景10s线性无限交替；
}