5

我在 Firefox 中遇到 css 转换问题。我使用 Twitter Bootstrap 轮播。我做了一些更改，所以图片不会从右向左滑动。相反，它们淡入淡出。我还在轮播字幕上添加了一些 CSS 过渡。

这是我的代码：http: //jsfiddle.net/Jh3rF/181/

在 Chrome 中一切正常，但在 Firefox（版本 16，Mac）中却不行。当我单击轮播中的下一个链接时，会有一个很好的过渡。活动幻灯片淡出，标题向右移动。但是下一张幻灯片的标题突然显示，而在 Chrome 中有一个很好的过渡（标题从上到下并且很好地淡入）。我在这里找不到任何错误。

我会很感激任何建议。

4

2 回答 2

0

我只是遇到了同样的问题，动画在 Google Chrome 上效果很好，但在 Firefox 中却突然出现。

所以我所做的非常简单，它会在下一张幻灯片出现时删除和添加类。

所以这里是代码：

$('#carousel-main').on('slide.bs.carousel', function (e) {
    $(e.relatedTarget).find('.animated').each(function() {
        var item = $(this);
        var classes = item.attr('class');
        item.attr('class', '');
        item.hide();
        setTimeout(function(){
            item.show();
            item.addClass(classes);
        }, 10);
    });
});
于 2015-03-13T22:58:41.100 回答
0

尝试为要具有过渡效果的属性声明基值，如本文中所回答：

为什么我的 CSS3 过渡在 Firefox 中不起作用？

于 2012-10-23T08:04:44.247 回答