CSS转换错误

Question

我构建了一个滑块，将其状态存储在浏览器的sessionStorage中，并利用背景图像上的-webkit-image-set在不同分辨率图像之间切换，具体取决于像素密度。我对它进行了测试，确保它能够正常工作，并且能够正常降级回到IE 9，但是当我在我的客户站点上实现它时，突然间动画淡化不再起作用。某处有一些冲突的CSS，但我似乎无法找到它。

工作版本在这里实现：

http://codepen.io/webconsult/pen/CEtIK?editors=110

，我有在实施它的麻烦该网站是在这里：

http://concept.rille.dk

我采用以下规则添加转场到元素

.bg-slider > * { 
    [...] 
    -webkit-transition: all 3s; 
    transition: all 3s; 
    [...] 
} 

请注意，我正在为转移属性使用'all'进行调试。在codepen中，我可以看到它是如何影响元素的高度，从而导致在调整浏览器视口高度时我调整背景的动画延迟（我使用js强制元素到浏览器的高度），但在现场，这并没有发生，指出过渡财产莫名其妙不被执行。但是当我检查开发工具时，看看它是否被覆盖它不是。

Answer 1

您正在使用“active”和“hidden”，它可能是hidden，它与Bootstrap的同名类不兼容。您可以通过删除Bootstrap并享受您最出色的bg滑块运行良好来进行测试。

解决方案：

http://jsbin.com/danezu/1/edit

更改类从.hidden和.active别的东西和它的作品。