Dan's Layers Tutorial
1.4  Moving Layers

Up, Down, Left, and Right

To simply move a layer up, down, left, or right, I'll create a function to perform each task:

function moveup() {
	document.layers["mylayer"].top -= 20;
}

function movedown() {
	document.layers["mylayer"].top += 20;
}

function moveleft() {
	document.layers["mylayer"].left -= 20;
}

function moveright() {
	document.layers["mylayer"].left += 20;
}

I am using the addition and subtraction equalities because I want to add or subtract pixels from the left or top positions. That way, every time you click the link, it will move continue to move. If you were to set a value like this...
document.layers["mylayer"].left = 20;
...the layer will just move to 20 pixels on the screen and stay there no matter how many times you activate the function.

Dan's Layers Tutorial
1.1 Introduction
1.2 Overlapping
1.3 Nesting
1.4 Using JavaScript
2.1 Sliding Layers
2.2 Pre-Built Functions
2.3 Clipping Layers
2.4 Looping Animations
2.5 Changing Images
3.1 Mouse-Click Animation
3.2 Capturing Keystrokes
3.3 Drag and Drop
4.1 Making Demos
4.4 Problems
4.5 Screen Sizes


Copyright © 1997 Dan Steinman. All rights reserved.