Browse Source

Pull request #2400: 无JIRA任务 动画

Merge in VISUAL/fineui from ~GUY/fineui:master to master

* commit 'e8480f910b566adf548e20ebdde31c813da9296e':
  动画
  动画
es6
guy 3 years ago
parent
commit
4a3c1425bd
  1. 6
      src/case/combo/bubblecombo/combo.bubble.js
  2. 47
      src/core/4.widget.js

6
src/case/combo/bubblecombo/combo.bubble.js

@ -55,9 +55,9 @@ BI.BubbleCombo = BI.inherit(BI.Widget, {
el: o.el, el: o.el,
popup: BI.extend({ popup: BI.extend({
type: "bi.bubble_popup_view", type: "bi.bubble_popup_view",
}, o.popup, { animation: "bi-zoom-big",
cls: (o.popup.cls || "") + " bi-zoom-big-enter bi-zoom-big-enter-active" animationDuring: 300,
}) }, o.popup)
}); });
this.combo.on(BI.Combo.EVENT_TRIGGER_CHANGE, function () { this.combo.on(BI.Combo.EVENT_TRIGGER_CHANGE, function () {
self.fireEvent(BI.BubbleCombo.EVENT_TRIGGER_CHANGE, arguments); self.fireEvent(BI.BubbleCombo.EVENT_TRIGGER_CHANGE, arguments);

47
src/core/4.widget.js

@ -7,6 +7,15 @@
*/ */
!(function () { !(function () {
var cancelAnimationFrame =
_global.cancelAnimationFrame ||
_global.webkitCancelAnimationFrame ||
_global.mozCancelAnimationFrame ||
_global.oCancelAnimationFrame ||
_global.msCancelAnimationFrame ||
_global.clearTimeout;
var requestAnimationFrame = _global.requestAnimationFrame || _global.webkitRequestAnimationFrame || _global.mozRequestAnimationFrame || _global.oRequestAnimationFrame || _global.msRequestAnimationFrame || _global.setTimeout;
function callLifeHook (self, life) { function callLifeHook (self, life) {
var hooks = [], hook; var hooks = [], hook;
hook = self[life]; hook = self[life];
@ -34,6 +43,8 @@
tag: null, tag: null,
disabled: false, disabled: false,
invisible: false, invisible: false,
animation: "",
animationDuring: 0,
invalid: false, invalid: false,
baseCls: "", baseCls: "",
extraCls: "", extraCls: "",
@ -467,14 +478,50 @@
}, },
setVisible: function (visible) { setVisible: function (visible) {
var self = this, o = this.options;
var lastVisible = !o.invisible;
this._setVisible(visible); this._setVisible(visible);
if (visible === true) { if (visible === true) {
// 用this.element.show()会把display属性改成block // 用this.element.show()会把display属性改成block
this.element.css("display", ""); this.element.css("display", "");
this._mount(); this._mount();
if (o.animation && !lastVisible) {
this.element.removeClass(o.animation + "-leave").removeClass(o.animation + "-leave-active").addClass(o.animation + "-enter");
if (this._requestAnimationFrame) {
cancelAnimationFrame(this._requestAnimationFrame);
}
this._requestAnimationFrame = function () {
self.element.addClass(o.animation + "-enter-active");
};
requestAnimationFrame(this._requestAnimationFrame);
if (this._animationDuring){
clearTimeout(this._animationDuring);
}
this._animationDuring = setTimeout(function () {
self.element.removeClass(o.animation + "-enter").removeClass(o.animation + "-enter-active");
}, o.animationDuring);
}
} else if (visible === false) { } else if (visible === false) {
if (o.animation && lastVisible) {
this.element.removeClass(o.animation + "-enter").removeClass(o.animation + "-enter-active").addClass(o.animation + "-leave");
if (this._requestAnimationFrame) {
cancelAnimationFrame(this._requestAnimationFrame);
}
this._requestAnimationFrame = function () {
self.element.addClass(o.animation + "-leave-active");
};
requestAnimationFrame(this._requestAnimationFrame);
if (this._animationDuring){
clearTimeout(this._animationDuring);
}
this._animationDuring = setTimeout(function () {
self.element.removeClass(o.animation + "-leave").removeClass(o.animation + "-leave-active");
self.element.css("display", "none");
}, o.animationDuring);
} else {
this.element.css("display", "none"); this.element.css("display", "none");
} }
}
this.fireEvent(BI.Events.VIEW, visible); this.fireEvent(BI.Events.VIEW, visible);
}, },

Loading…
Cancel
Save