-3

how do i write a function that uses getElementById to change the picture in that image to something new (picture2.jpg). then second function that changes the picture in that image back to the first picture (picture1.jpg).How do i then modify the image on the page so that when you run your mouse over it?

Am i at least headed in the right direction?

function getpic var pic = ("picture2.jpg) { if onmouseover(picture2.jpg)

else if onmouseout (picture1.jpg) }

  • Pretty good documentation on [mouseover](http://www.w3schools.com/jsref/event_onmouseover.asp) and [mouseout](http://www.w3schools.com/jsref/event_onmouseout.asp) addressing a very similar problem in their sample code. – Vivek Pradhan Nov 20 '14 at 04:07
  • This is quite trival, have you tried doing this? If so show us your code. This isn't a "we write code for you" site, it's Q&A about code. – Spencer Wieczorek Nov 20 '14 at 04:07

1 Answers1

0

Here's an example of how this could be done:

var link = document.getElementById('img');

function chngImg(){
  link.src = "http://placekitten.com.s3.amazonaws.com/homepage-samples/200/287.jpg";
  }

function chngImg2(){
  link.src = "http://placekitten.com/g/200/300"
  }
<img id="img" onmouseover="chngImg()" onmouseout="chngImg2()" src="http://placekitten.com/g/200/300"/>

If you need explanation, let me know. I hope this helps!

Ian Hazzard
  • 7,661
  • 7
  • 34
  • 60
  • I think I just kept trying to mix two things together that didn't necessarily go,and then left out half of it... but do I have to use "chngImg" or could I use any function name? – notsotechyyy Nov 20 '14 at 04:49
  • Use anything. Whatever you want is fine. Just make sure that you don't use a reserved keyword. http://www.w3schools.com/js/js_reserved.asp – Ian Hazzard Nov 20 '14 at 16:56