Move Object

Certainly one of the most frequently performed tasks in SiteSpinner™ is repositioning objects you have added to a page, so that they appear where you want them in the Work Window, and, subsequently, in your published web project.

When you add an object, it is positioned on the page using absolute coordinates. This will result in the object being displayed in the exact same position in the browser window when it is published or previewed. (The absolute positioning property can be changed so that objects are positioned in the browser relative to the browser window size. For more information, see Relative Positioning.)

By far the easiest way to reposition or move an object is manually in the Work Window using your mouse and keyboard. With either the Page Layout or Object Edit buttons in the Components Bar activated, you can click and drag an object wherever you want it. The object can be positioned within the viewable area of your project's target display resolution, or you can have it hanging partially off the page. (For more information, see Target Resolution Guide Border.)

To keep an object from becoming part of a table when you are moving it on the page, press and hold the ALT key while you are dragging it. Similarly, to keep an object from breaking free from a table when your clicking and dragging to move the table, hold the ALT key while you drag.

You can also move an object in "baby steps" using the nudge keys. With an object selected, press the Left, Right, Up, or Down keyboard arrow keys to nudge the object in 1 pixel increments along either the horizontal or vertical axes.

SiteSpinner™ offers some automated functions that can help you manually move objects in the Work Window more quickly and with greater precision. You can use the Tab key to make an object jump to a predefined Tab Guide, which you can use to align objects evenly either vertically or horizontally. Or, you can drag an object most of the way to a certain area of the page, and then let the Snap Grid "snap" the object into precise pixel coordinates. (For more information, see Alignment.)

If you require still greater precision when moving objects, you can use the Horizontal and Vertical Positioning controls in the Object Editor or the X and Y Position controls in the Quick Properties Editor. You can select an object to move, and then use the controls to set an exact positioning coordinate along the horizontal and vertical axes. For more information, see Object Editor Dialog Box and Quick Properties Editor Dialog Box.

When you move an object, it will remain selected even when it is moved behind another object.

If you lose an object, you can click the Reset button on the Object Tab of the Quick Properties Editor to move and scale it back to its default location. For more information, see Quick Properties Editor Dialog Box.

Moving an Object in the Work Window
  1. Click the Page Layout button: in the Components Bar

    OR

    Click the Object Edit button: in the Components Bar.

  2. In the Work Window, select the object that you want to move. For more information, see Select Object.
  3. Click the object and drag it to a new position in the Work Window.

You can also move an object in "baby steps" using the nudge keys. With an object selected, press the Left, Right, Up, or Down arrow keys to nudge the object in 1 pixel increments along either the horizontal or vertical axes.

You may use the Snap Grid to snap the object to a precise pixel position, or you may use the Tab Guide to align the object horizontally or vertically. For more information, see Snap Grid and Tab Guides.

Moving an Object to Precise Pixel Coordinates

Use either of the following procedures to move a selected object to a precise position in the Work Window:

Using the Quick Properties Editor:

  1. In the Work Window, select the object that you want to move.
  2. Press the ALT+Q keyboard shortcut

    OR

    Click the Quick Properties Editor button: in the Components Bar

    OR

    Select Object>Quick Properties Editor.

    The Quick Properties Editor dialog box will open.

  3. Click the Object Tab.
  4. Use the X Position spinner to move the object along the horizontal axis

    OR

    Enter a pixel position along the horizontal axis in the box.

  5. Use the Y Position spinner to move the object along the vertical axis

    OR

    Enter a pixel position along the vertical axis in the box.

  6. When you are finished, exit the Quick Properties Editor dialog box. The dialog box will close, and the object will be moved to the specified position.

Using the Object Editor:

  1. In the Work Window, select the object that you want to move.
  2. Press the ALT+O keyboard shortcut

    OR

    Click the Object Editor button: in the Align Bar

    OR

    Select Object>Object Editor.

    The Object Editor dialog box will open.

  3. Click the Transformations Tab.
  4. Use the Horizontal Position spinner to move the object along the horizontal axis

    OR

    Enter a pixel position in the box.

  5. Use the Vertical Position spinner to move the object along the vertical axis

    OR

    Enter a pixel position in the box.

  6. When you are finished, click OK. The dialog box will close, and the object will be moved to the specified position.

    By default, the object is set with Absolute positioning attributes. You may change the object's attribute to Relative or No CSS positioning. For more information, see Positioning.