Lunfalas Posted November 17, 2005 Share Posted November 17, 2005 Hello to everyone! I'm new here to the forum. I checked all the topics in JavaScript section, but I didn't find any similar question to mine, so...Let's say we have 3 buttons (A, B and C buton) for which we use JavaScript to make them glow or not when we put the mouse pointer over them.This is the JavaScript part for buttons' glow: function mouseOver(){document.a.src="buttons/a_glow.gif";document.b.src="buttons/b_glow.gif";document.c.src="buttons/c_glow.gif"}function mouseOut(){document.a.src="buttons/a_normal.gif";document.b.src="buttons/b_normal.gif";document.c.src="buttons/c_normal.gif"} This is the HTML part for calling the functions for buttons: <a href="page1.html" onmouseOver="mouseOver()" onmouseOut="mouseOut()"><img src="buttons/a_normal.gif" width="105" height="28" border="0" name="a"></a><a href="page2.html" onmouseOver="mouseOver()" onmouseOut="mouseOut()"><img src="buttons/b_normal.gif" width="105" height="28" border="0" name="b"></a><a href="page3.html" onmouseOver="mouseOver()" onmouseOut="mouseOut()"><img src="buttons/c_normal.gif" width="105" height="28" border="0" name="c"></a> The problem here is, that when we put the pointer over the button 'A' both buttons 'B' and 'C' are glowing too. Same happens if we put the pointer over button 'B' (in this case both 'A' and 'C' are glowing) or over button 'C' (both 'A' and 'B' are glowing).What to do, to achive that only the button, over which the pointer is, glows? a ) Is it needed to make a single function for every button like this? function mouseOver1(){document.a.src="buttons/a_glow.gif"}function mouseOut1(){document.a.src="buttons/a_normal.gif"}function mouseOver2(){document.b.src="buttons/b_glow.gif"}function mouseOver2(){document.b.src="buttons/b_normal.gif"}(...) b ) Do we solve the problem any other, more simple way?Thanks in advance for your replies!P.S. Are the functions here ACTUALLY written right? (All the periods, semi-colons, brackets etc. ?) Link to comment Share on other sites More sharing options...
MadPotato Posted November 17, 2005 Share Posted November 17, 2005 try a function like this: function makeItGlow(obj) { obj.src="glow.gif"} and in the mouseover, call the function in this way: makeItGlow(this)you'll pass as an attribute the object itself, so the function can handle it directly Link to comment Share on other sites More sharing options...
Lunfalas Posted November 17, 2005 Author Share Posted November 17, 2005 I forgot to say - could we do that on the mentioned case? Please? I mean, could you show me how the function part should look like and later, how the call tag should look like? I appologize, if I'm asking too much... Link to comment Share on other sites More sharing options...
Chocolate570 Posted November 17, 2005 Share Posted November 17, 2005 An easier way of doing it is giving the img tag a onclick="mouseOutthing('a')"In mouseoutthing, type: function mouseOutthing(blah){var x=document.getElementByIdswitch(blah){case "a"x(blah).src=""break...........}} And fill in the blanks where the dots are. Link to comment Share on other sites More sharing options...
Lunfalas Posted November 17, 2005 Author Share Posted November 17, 2005 Thank you. I will give it a try. 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