Jump to content

X and Y Image Stuff

Recommended Posts

Hello.How do you display an image ON an image using certain co-ordinates? That is probably much too difficult to understand, therefore I will explain better.If I have an image with the dimensions of... let's say, 500x500, and it was named "example1.png", and I had another image with the dimensions of 50x50, and it was named "example2.png", how would I display example2.png on example1.png and choose the co-ordinates for example2.png to be placed?Thanks.

Link to post
Share on other sites

You don't even need javascript for this, with HTML and CSS you can do it. This code should do what you want.

<div style="position: relative"><img src="example1.png" style="position: absolute; left: 0px; top: 0px;"><img src="example2.png" style="position: absolute; left: 80px; top: 90px;"></div>

Change "left" and "top" from the second image as you like. These images are inside a <div>, if you move the first image you'll have to add the left and top of that one to the distance you want in the second image.

Link to post
Share on other sites
  • 3 weeks later...

z-index can also be used to set the stacking order of elements

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...