https://account.internationalairportreview.com/JavaScript/mootools/core/Fx/Fx.Tween.js

1/*
2---
3
4name: Fx.Tween
5
6description: Formerly Fx.Style, effect to transition any CSS property for an element.
7
8license: MIT-style license.
9
10requires: Fx.CSS
11
12provides: [Fx.Tween, Element.fade, Element.highlight]
13
14...
15*/
16
17Fx.Tween = new Class({
18
19	Extends: Fx.CSS,
20
21	initialize: function(element, options){
22		this.element = this.subject = document.id(element);
23		this.parent(options);
24	},
25
26	set: function(property, now){
27		if (arguments.length == 1){
28			now = property;
29			property = this.property || this.options.property;
30		}
31		this.render(this.element, property, now, this.options.unit);
32		return this;
33	},
34
35	start: function(property, from, to){
36		if (!this.check(property, from, to)) return this;
37		var args = Array.flatten(arguments);
38		this.property = this.options.property || args.shift();
39		var parsed = this.prepare(this.element, this.property, args);
40		return this.parent(parsed.from, parsed.to);
41	}
42
43});
44
45Element.Properties.tween = {
46
47	set: function(options){
48		this.get('tween').cancel().setOptions(options);
49		return this;
50	},
51
52	get: function(){
53		var tween = this.retrieve('tween');
54		if (!tween){
55			tween = new Fx.Tween(this, {link: 'cancel'});
56			this.store('tween', tween);
57		}
58		return tween;
59	}
60
61};
62
63Element.implement({
64
65	tween: function(property, from, to){
66		this.get('tween').start(property, from, to);
67		return this;
68	},
69
70	fade: function(how){

71		var fade = this.get('tween'), method, args = ['opacity'].append(arguments), toggle;
72		if (args[1] == null) args[1] = 'toggle';
73		switch (args[1]){
74			case 'in': method = 'start'; args[1] = 1; break;
75			case 'out': method = 'start'; args[1] = 0; break;
76			case 'show': method = 'set'; args[1] = 1; break;
77			case 'hide': method = 'set'; args[1] = 0; break;
78			case 'toggle':
79				var flag = this.retrieve('fade:flag', this.getStyle('opacity') == 1);
80				method = 'start';
81				args[1] = flag ? 0 : 1;
82				this.store('fade:flag', !flag);
83				toggle = true;
84			break;
85			default: method = 'start';
86		}
87		if (!toggle) this.eliminate('fade:flag');
88		fade[method].apply(fade, args);
89		var to = args[args.length - 1];
90		if (method == 'set' || to != 0) this.setStyle('visibility', to == 0 ? 'hidden' : 'visible');
91		else fade.chain(function(){
92			this.element.setStyle('visibility', 'hidden');
93			this.callChain();
94		});
95		return this;
96	},
97
98	highlight: function(start, end){
99		if (!end){
100			end = this.retrieve('highlight:original', this.getStyle('background-color'));
101			end = (end == 'transparent') ? '#fff' : end;
102		}
103		var tween = this.get('tween');
104		tween.start('background-color', start || '#ffff88', end).chain(function(){
105			this.setStyle('background-color', this.retrieve('highlight:original'));
106			tween.callChain();
107		}.bind(this));
108		return this;
109	}
110
111});