Quantcast

Jump to content


Photo

Scriptaculous right based move


  • Please log in to reply
No replies to this topic

#1 Noitidart

Noitidart
  • Neocodex Co-Founder

  • 23214 posts


Users Awards

Posted 05 August 2010 - 12:17 PM

So scriptaculous move always adjusts the left. I changed it so it effects right. Sometimes its needed as right aligned or right floated elements get squished as they are moved off screen to the right.

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'
    });
  }
});



1 user(s) are reading this topic

0 members, 1 guests, 0 anonymous users