Skip to main content
removeu 347 caracteres do conteúdo
Fonte Link
Marconi
  • 18mil
  • 20
  • 69
  • 132

Aqui no W3Schools tem um bom exemplo.

Repare que ao passar o mouse em cima da imagem é chamada a função bigImge quando retirado chama a função normalImg.

function bigImg(x) {
    x.style.height = "64px";
    x.style.width = "64px";
}

function normalImg(x) {
    x.style.height = "32px";
    x.style.width = "32px";
}
<img onmouseover="bigImg(this)" onmouseout="normalImg(this)" border="0" src="httpssrc="http://www.googleqnimate.com.br/search?q=imagem&espv=2&biw=1024&bih=716&site=webhp&tbm=isch&imgil=bRpz9ibiAoE7jM%253A%253BjSHZUMjaJMS5bM%253Bhttp%25253A%25252F%25252Fwww.staypop.net%25252Fnoticia%25252Fveja-a-nova-imagem-de-procurando-dory&source=iu&pf=m&fir=bRpz9ibiAoE7jM%253A%252CjSHZUMjaJMS5bM%252C_&usg=__vwcNfYIPv3BULbM5q4Bi-0_DsDs%3D&ved=0ahUKEwjHzqvqwp-ODKAhUDFZAKHRQ2AEQQyjcIJQ&ei=bsC0VsffMYOqwASU7ICgBA"content/uploads/2014/03/images2.jpg" alt="Smiley" width="32" height="32">

Aqui no W3Schools tem um bom exemplo.

Repare que ao passar o mouse em cima da imagem é chamada a função bigImge quando retirado chama a função normalImg.

function bigImg(x) {
    x.style.height = "64px";
    x.style.width = "64px";
}

function normalImg(x) {
    x.style.height = "32px";
    x.style.width = "32px";
}
<img onmouseover="bigImg(this)" onmouseout="normalImg(this)" border="0" src="https://www.google.com.br/search?q=imagem&espv=2&biw=1024&bih=716&site=webhp&tbm=isch&imgil=bRpz9ibiAoE7jM%253A%253BjSHZUMjaJMS5bM%253Bhttp%25253A%25252F%25252Fwww.staypop.net%25252Fnoticia%25252Fveja-a-nova-imagem-de-procurando-dory&source=iu&pf=m&fir=bRpz9ibiAoE7jM%253A%252CjSHZUMjaJMS5bM%252C_&usg=__vwcNfYIPv3BULbM5q4Bi-0_DsDs%3D&ved=0ahUKEwjHzqvq-ODKAhUDFZAKHRQ2AEQQyjcIJQ&ei=bsC0VsffMYOqwASU7ICgBA" alt="Smiley" width="32" height="32">

Aqui no W3Schools tem um bom exemplo.

Repare que ao passar o mouse em cima da imagem é chamada a função bigImge quando retirado chama a função normalImg.

function bigImg(x) {
    x.style.height = "64px";
    x.style.width = "64px";
}

function normalImg(x) {
    x.style.height = "32px";
    x.style.width = "32px";
}
<img onmouseover="bigImg(this)" onmouseout="normalImg(this)" border="0" src="http://qnimate.com/wp-content/uploads/2014/03/images2.jpg" alt="Smiley" width="32" height="32">

Fonte Link
Marconi
  • 18mil
  • 20
  • 69
  • 132

Aqui no W3Schools tem um bom exemplo.

Repare que ao passar o mouse em cima da imagem é chamada a função bigImge quando retirado chama a função normalImg.

function bigImg(x) {
    x.style.height = "64px";
    x.style.width = "64px";
}

function normalImg(x) {
    x.style.height = "32px";
    x.style.width = "32px";
}
<img onmouseover="bigImg(this)" onmouseout="normalImg(this)" border="0" src="https://www.google.com.br/search?q=imagem&espv=2&biw=1024&bih=716&site=webhp&tbm=isch&imgil=bRpz9ibiAoE7jM%253A%253BjSHZUMjaJMS5bM%253Bhttp%25253A%25252F%25252Fwww.staypop.net%25252Fnoticia%25252Fveja-a-nova-imagem-de-procurando-dory&source=iu&pf=m&fir=bRpz9ibiAoE7jM%253A%252CjSHZUMjaJMS5bM%252C_&usg=__vwcNfYIPv3BULbM5q4Bi-0_DsDs%3D&ved=0ahUKEwjHzqvq-ODKAhUDFZAKHRQ2AEQQyjcIJQ&ei=bsC0VsffMYOqwASU7ICgBA" alt="Smiley" width="32" height="32">