Roll Over Link/Show Image in JS

  • CGFX
  • Graduate
  • Graduate
  • User avatar
  • Posts: 161
  • Loc: Chicago, IL.

Post 3+ Months Ago

ALL,

I need the code for the text rollover function. Example, let say the text is Eddie Murphy, I want the JavaScript code that when the mouse rolls over the text “Eddie Murphy” his image will show to whatever X & Y coordinates that are set. Or maybe there is a quick JQuery for that.

Can anyone offer any help?

Thank you I advance,

cgfX
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

  • righteous_trespasser
  • Scuffle
  • Genius
  • User avatar
  • Posts: 6230
  • Loc: South-Africa

Post 3+ Months Ago

HTML:
HTML Code: [ Select ]
<a id="em">Eddy</a><br />
<div id="image"></div>
  1. <a id="em">Eddy</a><br />
  2. <div id="image"></div>


JAVASCRIPT:
JAVASCRIPT Code: [ Select ]
$(document).ready(function(){
  $('#em').hover(function(){
    $('#image').html('<img src="/images/eddymurphy.jpg" alt="EM" />');
  });
  $('#em').mouseout(function(){
    $('#image').html('');
  });
});
  1. $(document).ready(function(){
  2.   $('#em').hover(function(){
  3.     $('#image').html('<img src="/images/eddymurphy.jpg" alt="EM" />');
  4.   });
  5.   $('#em').mouseout(function(){
  6.     $('#image').html('');
  7.   });
  8. });
  • CGFX
  • Graduate
  • Graduate
  • User avatar
  • Posts: 161
  • Loc: Chicago, IL.

Post 3+ Months Ago

righteous_trespasser,

Thank you very much for your help, I will give this a try and keep you updated. BTW, can you recommend a solid easy to understand learning JavaScript book(s) and/or online tutorial(s)?

Best,

cgfX
  • righteous_trespasser
  • Scuffle
  • Genius
  • User avatar
  • Posts: 6230
  • Loc: South-Africa

Post 3+ Months Ago

I don't know of any online tutorials/books, I usually just google what I am looking for specifically that day/project and sort that out and learn it step by step.

Post Information

  • Total Posts in this topic: 4 posts
  • Users browsing this forum: No registered users and 68 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
cron
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.