Javascript SwipeJS:Firefox问题

Javascript SwipeJS:Firefox问题,javascript,firefox,rendering,swipe,Javascript,Firefox,Rendering,Swipe,经过数小时的谷歌搜索,我在这里发布了以下问题: 我正在使用swipejs(swipejs.com)作为我网页上的响应式触摸滑块。 它非常酷,在所有浏览器和移动设备中都能满足我的需要 但是我在Firefox(版本18-20)上遇到了一个问题。 当我在“寻呼”的时候,第一张幻灯片看起来不错,第二张——以及后面的每一张——看起来都非常奇怪 我不能在网站上挑起这种行为——有时候看起来很好 js的滑动功能与translate()函数配合使用(而不是通过增加边距将幻灯片推离) 我发现,实际上Firefox的

经过数小时的谷歌搜索,我在这里发布了以下问题:

我正在使用swipejs(swipejs.com)作为我网页上的响应式触摸滑块。 它非常酷,在所有浏览器和移动设备中都能满足我的需要

但是我在Firefox(版本18-20)上遇到了一个问题。 当我在“寻呼”的时候,第一张幻灯片看起来不错,第二张——以及后面的每一张——看起来都非常奇怪

我不能在网站上挑起这种行为——有时候看起来很好

js的滑动功能与translate()函数配合使用(而不是通过增加边距将幻灯片推离) 我发现,实际上Firefox的翻译功能中有一个bug,使得幻灯片看起来很恐怖

我进一步了解到,当滑动项中有100%高度和宽度的图像时,不会出现此问题。 所以我使用了一个透明的.gif(w 100%/h 100%)来消除这个问题,但它对我不起作用

这种行为很难解释,因此这里有一个youtube链接,指向一个显示上述错误/问题的视频。

有人有同样的问题吗?
有人知道我的解决方案吗?

我通过在swipe.js的构造函数中调整(破解)transitions参数来解决这个问题。以我为例

transitions: (function (temp) {
          var props = ['transitionProperty', 'WebkitTransition', 'MozTransition', 'OTransition', 'msTransition'];
          for (var i in props) {

if (temp.style[props[i]] !== undefined) {
                return true;
              }
              return false;
          }
          return false;
}
变成

 transitions: (function (temp) {
          var props = ['transitionProperty', 'WebkitTransition', 'MozTransition', 'OTransition', 'msTransition'];
          for (var i in props) {

              if (navigator.userAgent.toLowerCase().indexOf('firefox') > -1) {
                return false;
              }
              else if (temp.style[props[i]] !== undefined) {
                return true;
              }
              return false;
          }
          return false;
}
不漂亮,但确实有效——试过了。您可以通过为版本18和更高版本添加一个附加检查来改进它

在firefox修复css转换错误之前,他们也会这么做,希望在某个时候他们会这么做


干杯

哦,不,小心Crab's hack,它会在iOs上破坏滑动。也许解决方案是省略for循环“return false;”中的最后一行但不确定副作用。