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.
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 |
|