Compound Images

[niche]

For example, I have a file called yellow_rectangle.jpg and a file called logo.jpg. What's the most flexible way to write the script that will display logo.jpg inside yellow_rectangle.jpg?If I can move yellow_rectangle.jpg around my screen using pixel coordinates, how would I write that script? If not, what's most flexible way to move it around my screen?Thank you

[jeffman]

To locate something, use element.offsetLeft, element.offsetTop, element.offsetWidth, and element.offsetHeight. To position something, use element.style.top, etc.To move (that is, to have a position out of the normal flow) an element needs CSS position:absoluteIncrement/decrement coordinates 1 px at a time at a sensible interval. Compare the logo boundaries with the container boundaries so you know when to stop and go back.To keep something animated, use setInterval or setTimeout to call the animating function.

[victorlonmo@gmail.com]

DD is correctBased on your question I'm guessing you want to know the easiest way to do this. My suggestion is to:1. Familiarize yourself with CSS, specifically position absolute. This will allow you to statically place the images. You may also wish to learn about the z-index property which will ensure the images are stacked in the correct order.2. Learn how to modify the CSS properties using Javascript.3. Learn timing/animation functions in Javascript which you then use to control the position. If I were doing this I would avoid trying to read the CSS property that controls the image location. I've never had difficulty writing to a CSS property from javascript but reading them can be very difficult because every browser seems to use different syntax. This recently gave me some issues with Chrome.W3 schools has great tutorials and I think I've used tutorials for #1 and #3 myself. floater