滑块不在野生动物园工作

Question

我有一个奇怪的问题，我已经建立了一个基本的滑块，而不是在IOS上滑动的文本，它只是出现。我认为这是转换：translateX css语句，但我已经提出所有选项，我仍然有问题。有什么想法吗？

如果您转到http://www.ospreyactionsports.co.uk/并将视口设置为低于767，您将看到置信横幅滑块。下面是滑块的css供参考：

@media only screen and (max-width: 767px) {
  .banners {
    height: 37px;
    width: 100%;
  }
  .banners .banner {
    opacity: 0;
    position: absolute;
    -webkit-transform: translateX(-100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
  }
  .banners .displayed {
    display: block;
    margin-left: calc(25%);
    opacity: 1;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transition: .3s;
    transition-timing-function: linear;
    width: 310px;
  }
}