用ALEX理解过渡函数

Question

嘿，伙计们，我对js很陌生，我读了这篇文章，在bootstrap.js中提供了一种过渡参考：

使用Jquery的CSS转换

现在，如果您转到程序转换部分，这是我尝试实现的部分。

小提琴在这里。

但不知何故，这篇著名文章中的代码不起作用。

为什么？

代码如下：

$(document).ready(function () {
    var defaults = {
        duration: 4000,
        easing: ''
    };

    $.fn.transition = function (properties, options) {
        options = $.extend({}, defaults, options);
        properties['webkitTransition'] = 'all ' + options.duration + 'ms ' + options.easing;
        console.log(properties);
        $(this).css(properties);
    };

    $('.element').transition({
        background: 'red'
    });

});

Answer 1

在transition.js中找到解决方案

我需要一些代码如下：

var transEndEventNames = {
  WebkitTransition : 'webkitTransitionEnd',
  MozTransition    : 'transitionend',
  OTransition      : 'oTransitionEnd otransitionend',
  transition       : 'transitionend'
}

for (var name in transEndEventNames) {
  if (el.style[name] !== undefined) {
    return { end: transEndEventNames[name] }
  }
}

当我在mozilla中测试时，我的代码只在chrome中工作。

谢谢你们的时间各位。