36pixels Posted July 24, 2012 Share Posted July 24, 2012 HiI am trying to create a webpage using two image files,which switch between one another as the mouse pointer moves over the images.I am using the onMouseover and onMouseout event handlers.I tried the following code but it is not working!!Please tell me how can I make this code work.Please dont tell me about jquery or anything else. <HTML><HEAD> <TITLE> New Document </TITLE><script type="text/JavaScript">ch(img1){ document.getElementById(a).src=2.jpg;}ch1(img1){ document.getElementById(a).src=3.jpg;}</SCRIPT></HEAD><BODY> <A onmouseover="ch(img1)" onmouseout="ch1(img1)"><IMG SRC="1.jpg" WIDTH="140" HEIGHT="160" BORDER="0" ALT="" id=a></A></BODY></HTML> Link to comment Share on other sites More sharing options...
Ingolme Posted July 24, 2012 Share Posted July 24, 2012 The strings "2.jpg" and "3.jpg" need to be delimited by quotation marks.The string "a" in document.getElementById(a) needs to be delimited by quotation marks as well. The syntaxch(img1) {} isn't valid. A function needs to be declared like this: function name(param1, param2) { // Code} I think you need to read the Javascript tutorial from the beginning. 1 Link to comment Share on other sites More sharing options...
eTianbun Posted July 24, 2012 Share Posted July 24, 2012 (edited) Nevermind, just Do what ingolme said! Edited July 24, 2012 by CodeName Link to comment Share on other sites More sharing options...
36pixels Posted July 24, 2012 Author Share Posted July 24, 2012 (edited) Hi Ingolme,Thanks for the reply but I tried this code as per your suggestions and it still donot work!!Code: <HTML><HEAD> <TITLE> New Document </TITLE><script type="text/JavaScript">function ch(img1){ document.getElementById('a').src="2.jpg";}function ch1(img1){ document.getElementById('a').src="3.jpg";}</SCRIPT></HEAD><BODY> <A onmouseover="ch(img1)" onmouseout="ch1(img1)"><IMG SRC="1.jpg" WIDTH="140" HEIGHT="160" BORDER="0" id='a'></A></BODY></HTML> BTW, "a" here is id name and not string name!! Edited July 24, 2012 by 36pixels Link to comment Share on other sites More sharing options...
thescientist Posted July 24, 2012 Share Posted July 24, 2012 you can't have the functions called the same name. you need to give them different names. and if you want to pass a string in a function call, you need to do that correctly too. onmouseover="ch('img')" although you aren't even using it, so I don't even see the point. 1 Link to comment Share on other sites More sharing options...
thescientist Posted July 24, 2012 Share Posted July 24, 2012 aside from reading the JS tutorials, you should learn how to use your browsers console and looking for errors and debugging your code. Link to comment Share on other sites More sharing options...
Ingolme Posted July 25, 2012 Share Posted July 25, 2012 The ID is a string, just like every other attribute value. You might need to learn about the string data type in Javascript. Images may take a few seconds to load. Put the mouse over the image and wait to see if it loads. If it doesn't, open the error console (Control+shift+J in Firefox). Link to comment Share on other sites More sharing options...
36pixels Posted July 25, 2012 Author Share Posted July 25, 2012 (edited) Hi :)Thanks Everybody for their helpful answers.I tried the Error Console as per Ingolme's advice, and here is what i get-"Error: img1 is not definedLine: 1" Now the effect is coming but I dont know why the " img1 is not defined" error is given! Can anyone pls tell me? Also,I dont understand what Line 1 is because the code is not in line no 1 of my program!!Can anyone tell me what line number in the error console indicates? Edited July 25, 2012 by 36pixels Link to comment Share on other sites More sharing options...
Ingolme Posted July 25, 2012 Share Posted July 25, 2012 Just remove img1 from this line because it is not being used: onmouseover="ch(img1)" onmouseout="ch1(img1)" 1 Link to comment Share on other sites More sharing options...
36pixels Posted July 25, 2012 Author Share Posted July 25, 2012 Ok I thanked both of you. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now