Effect.MoveR = Class.create(Effect.Base, { initialize: function(element) { this.element = $(element); if (!this.element) throw(Effect._elementDoesNotExistError); var options = Object.extend({ x: 0, y: 0, mode: 'relative' }, arguments[1] || { }); this.start(options); }, setup: function() { this.element.makePositioned(); this.originalright = parseFloat(this.element.getStyle('right') || '0'); this.originalTop = parseFloat(this.element.getStyle('top') || '0'); if (this.options.mode == 'absolute') { this.options.x = this.options.x - this.originalright; this.options.y = this.options.y - this.originalTop; } }, update: function(position) { this.element.setStyle({ right: (this.options.x * position + this.originalright).round() + 'px', top: (this.options.y * position + this.originalTop).round() + 'px' }); } });
Just paste that in and you'll get a new effect called MoveR. To use go like usual:
new Effect.MoveR
This one does right and bottom:
Effect.MoveR = Class.create(Effect.Base, { initialize: function(element) { this.element = $(element); if (!this.element) throw(Effect._elementDoesNotExistError); var options = Object.extend({ x: 0, y: 0, mode: 'relative' }, arguments[1] || { }); this.start(options); }, setup: function() { this.element.makePositioned(); this.originalright = parseFloat(this.element.getStyle('right') || '0'); this.originalBottom = parseFloat(this.element.getStyle('bottom') || '0'); if (this.options.mode == 'absolute') { this.options.x = this.options.x - this.originalright; this.options.y = this.options.y - this.originalBottom; } }, update: function(position) { this.element.setStyle({ right: (this.options.x * position + this.originalright).round() + 'px', bottom: (this.options.y * position + this.originalBottom).round() + 'px' }); } });