Display text on MouseOver for image in html

Question

I would like to display text when the user mouseovers the image   How can I do this in HTML JS

User · Answer

You can use CSS hover in combination with an image background.

CSS

   .image
{
    background:url(images/back.png);
    height:100px;
    width:100px;
    display: block;
    float:left;
}

.image  a {
    display: none;
}

.image  a:hover {
    display: block;
}

HTML

<div class="image"><a href="#">Text you want on mouseover</a></div>

User · Answer

You can do like this also   HTML    lt a gt  lt img src  https   encrypted-tbn2 google com images q tbn ANd9GcQB3a3aouZcIPEF0di4r9uK4c0r9FlFnCasg P8ISk8tZytippZRQ  onmouseover  somefunction     gt  lt  a gt    In javascript   function somefunction         Do somethisg

User · Answer

You can use CSS hover  Link to jsfiddle here  http   jsfiddle net ANKwQ 5    HTML     lt a gt  lt img src  https   encrypted-tbn2 google com images q tbn ANd9GcQB3a3aouZcIPEF0di4r9uK4c0r9FlFnCasg P8ISk8tZytippZRQ  gt  lt  a gt   lt div gt text lt  div gt      CSS   div       display  none      border 1px solid  000      height 30px      width 290px      margin-left 10px     a hover   div       display  block

User · Answer

You can use title attribute    lt img src  smiley gif   title  Smiley face   gt    You can change the source of image as you want   And as  Gray commented   You can also use the title on other things like  lt a     anchors   lt p gt    lt div gt    lt input gt   etc   See  this

[html] Display text on MouseOver for image in html

Examples related to html

Examples related to image