jqueryを使用して自分のコンピュータ内の画像を変更する

Question

自分のコンピュータ上で別の画像に切り替えるには、マウスの上にマウスを置いてマウスを置いたときに元の画像を戻す必要があります。

これは私がこれまでのところ、それを持っているjQueryのコードです：

$('.first-image').mouseover(function(){ 
    $(this).toggleClass('second-image');  
}); 
$('.second-image').mouseover(function(){ 
    $(this).toggleClass('first-image'); 
}); 

は、私はそれが互いの間で画像を切り替えないようにしてtoggleClassを交換するかわからないです。マウスを置いたときに画像を切り替えるのではなく、コンピュータの別のものに切り替えるために画像を1つだけ必要とします。

Answer 1

first-imageはcssクラスです。あなたは自分のcssクラスに置き換えることができます。

<style> 
.myimage{ 
    background-image: url(nameofmyimage.png); 
} 
</style> 


<script> 
$('.first-image').mouseover(function(){ 
    $(this).toggleClass('myimage'); 
}); 
$('.second-image').mouseover(function(){ 
    $(this).toggleClass('myimage'); 
}); 
</script> 

Answer 2

あなたは上記の画像を使用してHTMLコードを投稿この

<style> 
.yourfirst-image{ 
    background-image: url(yourfirstimage.jpeg); 
} 
.yoursecond-image{ 
    background-image: url(yoursecondimage.jpeg); 
} 

</style> 
<script> 
$(.first-image).mouseover(function(){ 
     $(this).toggleClass(.yoursecond-image); 
    }); 
    $(.first-image).mouseout(function(){ 
     $(this).toggleClass(.yourfirst-image); 
    }); 
</script>