Question

Is there a tool tip that instead of making the title appear in it i can make information from a div appear…
what i have is a image and i want maybe an invisible div below it, so when a user hovers over the image the div appears with name address face book like in it etc?

<img width="448" height="300" src="/Content/uploadedImg/1.png                                                                                                                                                                                                                                                          " onerror="this.src='/Content/img/redboxlrg.png';">

Answer 1

You can try something like –

<img width="448" height="300" src="/Content/uploadedImg/1.png" id="hoverimage" />
<div id="showdiv" style="display:none;">Hidden initially, because of 'display:none;'</div>
<script>
  $("#hoverimage").hover(function(){
    //this happens when you first 'hover' over the image with id = 'hoverimage'
    $("#showdiv").stop().fadeIn(500); //stop() is important, it prevents a 'queue' from building
    //the .fadeIn(n) function will fade an element in over n milliseconds
  }, function(){
    //this happens when the mouse moves out/hover ends
    $("#showdiv").stop().fadeOut(500);
    //similarly, the fadeOut(n) function fades an element out over n ms
  }
</script>

Note that for this, you will need to also include the jQuery library, to make use of the jQuery (or $) functionality.

See http://www.worthapost.com/articles/how-include-jquery-your-website-google for more on that