webmaster1 Posted April 3, 2010 Share Posted April 3, 2010 I want to display and dynamically interchange the text within a <div> when the mouse cursor hovers over either one of four images. For example, image1, image2, image3, and image4 could prompt start, previous, next and end respectivly. Can anyone assist me in triggering the text to be displayed and interchanged as described? <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Show Text on Image Hover</title> </head> <body> <div id="showtext"> <?php echo""; ?> </div> <img src="images/image1.jpg" width="25" height="25" alt="image1" name="image1" id="image1" > <img src="images/image2.jpg" width="25" height="25" alt="image2" name="image2" id="image2" > <img src="images/image3.jpg" width="25" height="25" alt="image3" name="image3" id="image3" > <img src="images/image4.jpg" width="25" height="25" alt="image4" name="image4" id="image4" > </body> Quote Link to comment Share on other sites More sharing options...
ialsoagree Posted April 3, 2010 Share Posted April 3, 2010 This isn't something you can do with PHP, this is a javascript issue. <script type="text/javascript"> function change_div_text(text) { document.getElementById('showtext').innerHTML = text; } </script> <img onmouseover="change_div_text('Some text here')" onmouseout="change_div_text('')" src="images/image1.jpg" width="25" height="25" alt="image1" name="image1" id="image1" > <img onmouseover="change_div_text('Other text here')" onmouseout="change_div_text('')" src="images/image2.jpg" width="25" height="25" alt="image2" name="image2" id="image2" > etc. Quote Link to comment Share on other sites More sharing options...
Lukeidiot Posted April 3, 2010 Share Posted April 3, 2010 I want to display and dynamically interchange the text within a <div> when the mouse cursor hovers over either one of four images. For example, image1, image2, image3, and image4 could prompt start, previous, next and end respectivly. Can anyone assist me in triggering the text to be displayed and interchanged as described? <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>Show Text on Image Hover</title> </head> <body> <div id="showtext"> <?php echo""; ?> </div> <img src="images/image1.jpg" title="test" width="25" height="25" alt="image1" name="image1" id="image1" > <img src="images/image2.jpg" title="test" width="25" height="25" alt="image2" name="image2" id="image2" > <img src="images/image3.jpg" title="test" width="25" height="25" alt="image3" name="image3" id="image3" > <img src="images/image4.jpg" title="test" width="25" height="25" alt="image4" name="image4" id="image4" > </body> I'ved add the "title" attribute to the img tag. Quote Link to comment Share on other sites More sharing options...
webmaster1 Posted April 3, 2010 Author Share Posted April 3, 2010 This isn't something you can do with PHP, this is a javascript issue. That's exactly what I was trying to achieve, much thanks. My JavaScript skills are reserved mainly to editing large chucks of copied and pasted unoriginal code. I was trying to figure out how to do this on W3schools but just couldn't piece it together. Cheers! Quote Link to comment Share on other sites More sharing options...
webmaster1 Posted April 3, 2010 Author Share Posted April 3, 2010 I'ved add the "title" attribute to the img tag. Thanks! Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.