By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
437,598 Members | 1,894 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 437,598 IT Pros & Developers. It's quick & easy.

Equating an Image Object to another does not give the desired result, plz help.

P: 6
Hi there, I just found these forums and several questions I had have been answered by just reading the posts but this one.

I have simplified my code in order to just get to the point with my question.
This is my html code:

Expand|Select|Wrap|Line Numbers
  1. <html>
  2. <head>
  3. </head>
  4. <body>
  5.  
  6.  <img id="img1" src="images/smile.jpg" style="border:#0000FF solid 2px;"/>
  7.  
  8.  <script language="javascript">
  9.  
  10.    my_image = new Image;
  11.    my_image.src="images/sad.jpg"; my_image.style.border="#FFFFFF solid 5px";
  12.  
  13.    x=document.getElementById("img1");
  14.    x=my_image;
  15.  </script>
  16.  
  17. </body>
  18. </html>
  19.  
Before I set "x=my_image", the x object is referring to the image object within the document, so far so good. After the assignment, x is referring to the my_image object and now there is no relationship at all with the image within the document. What I want to accomplish is for the image object within the document to be referring to the my_image object so it updates all of the properties I pre-set for my_image(which will be several in my real code). How can I do that?, or is it best to remove the image object and then append the new my_image to the document(or to the container that will hold it)?

I want to do an image slicing within an html document so I would be updating that object with different images and properties through an adequate set of controls and javascript events of course, this code is just the idea to present my problem.
Jul 9 '08 #1
Share this Question
Share on Google+
3 Replies


100+
P: 428
The Image object is not an html element. It does have a src property, which you can read and apply to an img element.


my_image = new Image();
my_image.src="images/sad.jpg";

document.getElementById("img1").src= my_image.src;
Jul 9 '08 #2

rnd me
Expert 100+
P: 427
The Image object is not an html element.

dont want to be a wise-guy, but i think you might be wrong:

Expand|Select|Wrap|Line Numbers
  1. var i = new Image(100,100);
  2.  
  3. alert(i.constructor) // "HTMLImageElement"
  4.  
  5. //  also it can be appended just like any other element:
  6.  
  7. i.src="http://bytes.com/forum/customavatars/avatar117351_1.gif";
  8. document.body.appendChild(i)
  9.  
  10.  
Jul 9 '08 #3

rnd me
Expert 100+
P: 427

What I want to accomplish is for the image object within the document to be referring to the my_image object so it updates all of the properties I pre-set for my_image(which will be several in my real code). How can I do that?, or is it best to remove the image object and then append the new my_image to the document(or to the container that will hold it)?

I want to do an image slicing within an html document so I would be updating that object with different images and properties through an adequate set of controls and javascript events of course, this code is just the idea to present my problem.

>> How can I do that?, : you can't. once its in the dom, you have to use dom MPEs to alter it in a way that changes appear.


>> or is it best to remove the image object and then append the new my_image to the document(or to the container that will hold it)? : thats what i would do, or perhaps give the tag a id, and put all of your images inside the container, img.style.display="none".
then simply 1. hide all of them. 2. show the one you need. to change the image.
Jul 9 '08 #4

Post your reply

Sign in to post your reply or Sign up for a free account.