+ 1

how can i use javascript this to swap a backgroundimage on mouse over event

It's urgent ,I need answers, reasonable answers ASAP

23rd Jun 2016, 3:44 PM
Joel Okafor
Joel Okafor - avatar
8 odpowiedzi
+ 2
Assuming your Image html looks something like this: <img src='/images/image1.jpg'/> Create a Javascript function to change the image of whatever gets passed through : function changeimg(image) { image.src = 'image2.jpg'; } Then attach a mouseover event to it so that it calls the function: <img src='/folder/image1.jpg' onmouseover='changeimg(this)'/> Now everytime you rollover the image with your mouse, it'll call the function that'll change the image! I would try looking into Jquery. This would be much simpler.
23rd Jun 2016, 4:14 PM
Jonathan Morales
+ 1
please listen to where I've gone wrong, I used the function method but it still didn't work... function upDate (previewPic) { document. get ElementById("theNameOfTheTextToReplace").innerHTML = previewPic. alt; } now that's for displaying the images text. However how can I change the image it's self using a full URL as it's address. please remember that the code I highlighted is a JavaScript base which is called externally to the HTML file
23rd Jun 2016, 4:24 PM
Joel Okafor
Joel Okafor - avatar
+ 1
I'm just curious, why use JavaScript and not CSS?
23rd Jun 2016, 5:21 PM
ZinC
ZinC - avatar
+ 1
CSS is used quite alright but can I link my JavaScript to my CSS so that the background properties can be used @Zinc if yes how using the JavaScript code I wrote earlier to create a mouse over effect
23rd Jun 2016, 5:26 PM
Joel Okafor
Joel Okafor - avatar
+ 1
then how do you make a mouse over effect with multiple images..!? @ Zinc please this is what I'm trying to achieve, I want to display an image in a div by mouse overing on three different image tags. each hover changes the picture shown on the div and when the mouse is hovered away from the image tag, the div should return back to its original image
23rd Jun 2016, 5:37 PM
Joel Okafor
Joel Okafor - avatar
+ 1
guys I've figured out the answer to my question if using the this keyword of a function called inside the HTML tag ; mouse over ="displayPic"/> I.e inside the HTML then the js code will be function display (nameOfMyParemeter) { document.getElementId("nameOfTheTagId").innerHTML = nameOfMyParemeter. alt; }
24th Jun 2016, 1:52 AM
Joel Okafor
Joel Okafor - avatar
0
Just use pure CSS, no need for any JavaScript. Describe what you want to achieve exactly.
23rd Jun 2016, 5:31 PM
ZinC
ZinC - avatar
0
Multiple images on different divs were not mentioned in your earlier post, or maybe I've missed something. I thought it was just one image. I don't have a solution from the top of my head. Maybe jQuery is a solution.
23rd Jun 2016, 5:58 PM
ZinC
ZinC - avatar