css @keyframes动画不适用于Windows的Safari

我制作了一个可以淡入淡出，幻灯片或两者都可以作为过渡的传送带脚本。这可以通过更改父容器的类名（＃moduleCarousel_12）来设置。css @keyframes动画不适用于Windows的Safari

在Chrome工作正常。

在Safari（适用于Win）但是：

淡出只能如果家长也有在类名“向左滑动”。这很奇怪，因为它只添加了第二个动画（左定位）。

.moduleCarousel.fade > div.active { 
 
    z-index: 3; 
 
    opacity: 1; 
 
    -webkit-animation-name: fade; 
 
    animation-name: fade; 
 
} 
 
.moduleCarousel.slide.left.fade > div.active { 
 
    -webkit-animation-name: slide-left, fade; 
 
    animation-name: slide-left, fade; 
 
} 
 

 
/* Chrome, Safari, Opera */ 
 
@-webkit-keyframes fade { 
 
    0% {opacity: 0; -moz-opacity: 0;} 
 
    100% {opacity: 1; -moz-opacity: 1;} 
 
} 
 
/* Standard syntax */ 
 
@keyframes fade { 
 
    0% {opacity: 0; -moz-opacity: 0;} 
 
    100% {opacity: 1; -moz-opacity: 1;} 
 
} 
 

 
@-webkit-keyframes slide-left { 
 
    0% {left: 100%;} 
 
    100% {left: 0%;} 
 
} 
 
@keyframes slide-left { 
 
    0% {left: 100%;} 
 
    100% {left: 0%;} 
 
}

2.幻灯片切换完全不

工作，我在做什么错？ :)

来源

2014-09-22 Philip

苹果公司在Windows上放弃了对Safari的支持 - 不用担心它能够正常工作，因为它被窃听并且不会被更新。 – easwee 2014-10-01 09:20:57

windows上的Safari浏览器不是一个“真正的”浏览器，它是模拟的，在其上工作。有很多关于它的错误，并且很多网页设计师都遇到了问题，并且苹果在2012年撤回了他们对Windows系统上safari的支持。好的部分是，获得彩票的机会比找窗户的机会高-safari用户。

来源

2014-10-01 08:35:19 Gho

截至2014年9月，Safari 5.1用户占互联网用户的0.83％。我找不到从Apple拆分Windows的方法，但可以肯定的是，假设0.83％中的100％不是Windows。 http://gs.statcounter.com/#desktop-browser_version_partially_combined-ww-monthly-201309-201409 – 2014-10-02 03:37:43

所以这是Safari（对于Windows）中的一个错误，显然没有解决方法。

编辑： 根据CSS-tricks.com和w3schools.com我定义动画的方式是正确的。（除非我错过了什么？）并且它适用于所有浏览器，除了Windows版Safari。

因为没有人知道它为什么不起作用，正如Easwee和Gho所说，苹果公司不再支持这个版本的浏览器，合乎逻辑的结论是：这是一个错误，在这一刻没有修复。（并且可能永远不会有）

但是，如果我错了，或者如果我在脚本中犯了错误，请告诉我。

来源

2014-09-30 13:20:34 Philip

这不提供问题的答案。要批评或要求作者澄清，请在其帖子下方留言。 – webeno 2014-10-01 09:24:09

问题的答案是：没有解决方案，这是一个没有解决的问题。所以，这是Gho承认的正确答案。 :)不幸的是当然:) – Philip 2014-10-01 12:13:27

也许你想提供你的信息的来源，然后... – webeno 2014-10-01 12:20:12

css @keyframes动画不适用于Windows的Safari

回答

相关问题