madrobby / scriptaculous

400

1397

Description:

script.aculo.us is an open-source JavaScript framework for visual effects and interface behaviours.

Home | Edit | New

Effect.Move

Core Effects > Effect.Move

This effect moves an element by modifying its position attributes.

Syntax

This will move the object to the top left corner of the window (x=0; y=0):


new Effect.Move('object', { x: 0, y: 0, mode: 'absolute' });

This will move the object 30px up and 20px to the right relative to its current position:


new Effect.Move('object', { x: 20, y: -30, mode: 'relative' });

Options

Options	Description
x	integer value, either the new absolute target of the effect elements left value or the modifier of its current left value, depending on the `mode` option
y	integer value, either the new absolute target of the effect elements top value or the modifier of its current top value, depending on the `mode` option
mode	string, defaults to `'relative'`, can also be `'absolute'`, specifies if the element is moved absolutely or relative to its own position.

Demo

Click me for a demo!

Source code of this demo


<style type="text/css">
  a#move_demo { background:#fa0000; color:#fff; padding:5px; border:1px solid #000; }
</style>

<div class="demo">
  <a href="#" id="move_demo" onclick="new Effect.Move(this, { x: 60, y: -30 }); return
false;">Click me for a demo!</a>
</div>

Last edited by nikschroder, Sat Jan 17 12:09:25 -0800 2009