6 description: Formerly Fx.Style, effect to transition any CSS property for an element.
8 license: MIT-style license.
12 provides: [Fx.Tween, Element.fade, Element.highlight]
17 Fx.Tween = new Class({
21 initialize: function(element, options){
22 this.element = this.subject = document.id(element);
26 set: function(property, now){
27 if (arguments.length == 1){
29 property = this.property || this.options.property;
31 this.render(this.element, property, now, this.options.unit);
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);
45 Element.Properties.tween = {
47 set: function(options){
48 this.get('tween').cancel().setOptions(options);
53 var tween = this.retrieve('tween');
55 tween = new Fx.Tween(this, {link: 'cancel'});
56 this.store('tween', tween);
65 tween: function(property, from, to){
66 this.get('tween').start(arguments);
71 var fade = this.get('tween'), o = 'opacity', toggle;
72 how = [how, 'toggle'].pick();
74 case 'in': fade.start(o, 1); break;
75 case 'out': fade.start(o, 0); break;
76 case 'show': fade.set(o, 1); break;
77 case 'hide': fade.set(o, 0); break;
79 var flag = this.retrieve('fade:flag', this.get('opacity') == 1);
80 fade.start(o, (flag) ? 0 : 1);
81 this.store('fade:flag', !flag);
84 default: fade.start(o, arguments);
86 if (!toggle) this.eliminate('fade:flag');
90 highlight: function(start, end){
92 end = this.retrieve('highlight:original', this.getStyle('background-color'));
93 end = (end == 'transparent') ? '#fff' : end;
95 var tween = this.get('tween');
96 tween.start('background-color', start || '#ffff88', end).chain(function(){
97 this.setStyle('background-color', this.retrieve('highlight:original'));