本文介绍了更改图像onmouseover的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

 < p>< p>在鼠标悬停上更改图像的正确方法是什么(带/不带jQuery)? a href =#id =name> 
gt ;
< / a>

好的,这是可行的,但是如何在 mouseout ?



如果可能的话,我想在没有document.ready函数的情况下内联这个东西。

解决方案

尝试类似以下内容:

p>

 < img src ='/ folder / image1.jpg'id ='imageid'/> 

jQuery:

  $('#imageid')。hover(function(){
$(this).attr('src','/ folder / image2.jpg');
},function(){
$(this).attr('src','/folder/image1.jpg');
});






$ b 编辑: (在发布OP HTML之后)



HTML: b $ b

 < a href =#id =name> 
< img title =Hellosrc =/ ico / view.png/>
< / a>

jQuery:

  $('#name img')。hover(function(){
$(this).attr('src','/ico/view1.png' );
},function(){
$(this).attr('src','/ico/view.png');
});






What's the correct way to change an image on mouseover and back on mouseout (with/without jQuery)?

<a href="#" id="name">
    <img title="Hello" src="/ico/view.png" onmouseover="$(this).attr('src','/ico/view.hover.png')" />
</a>

Ok, this is working, but how to change back to the original image after mouseout?

If it is possible, I want to do this thing inline, without document.ready function.

解决方案

Try something like this:

HTML:

<img src='/folder/image1.jpg' id='imageid'/>

jQuery:

$('#imageid').hover(function() {
  $(this).attr('src', '/folder/image2.jpg');
}, function() {
  $(this).attr('src', '/folder/image1.jpg');
});

EDIT: (After OP HTML posted)

HTML:

<a href="#" id="name">
    <img title="Hello" src="/ico/view.png"/>
</a>

jQuery:

$('#name img').hover(function() {
  $(this).attr('src', '/ico/view1.png');
}, function() {
  $(this).attr('src', '/ico/view.png');
});

这篇关于更改图像onmouseover的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-31 06:23