jquery - CSS3(またはjQuery)フェードインイメージ

Question

だから、私は少しコードを持っています。それを変更してやりたいのは、特定の背景画像を持ち、ホバーすると別の画像にフェードインすることです。CSS3 か jQuery か。提案したい場合は、これを達成する方法についての良い場所もいいでしょう.

Answer 1

Mennan のソリューションを完成させるには、jQuery を使用している場合は、このようにして要素にカーソルを合わせると背景画像を変更します (<div>この場合)。

$('#mydiv').mouseenter( function() {
  $(this).css('background-image','url(/images/second.png)');
}).mouseleave(function() {
  $(this).css('background-image','url(/images/original.png)');
});

Answer 2

サンプルを参照してください:

http://jsfiddle.net/GaYKF/56/

jquery を使用します。

 $("#myDiv").hover(
function(){
  $(this).fadeTo('slow', 0.3, function()
    {
        $(this).css('background-image', 'url("http://1.bp.blogspot.com/-tOHKWImzMJQ/TlHqjy1C_II/AAAAAAAAAWw/T5WGegi1sVc/s320/blue+%25288%2529.jpg")');
    }).fadeTo('slow', 1);
}, 
function(){
   $(this).fadeTo('slow', 0.3, function()
    {
        $(this).css('background-image', 'url("http://1.bp.blogspot.com/-nI97Eqlkfh0/TlHp2CS0_XI/AAAAAAAAAWU/kRGbOd6YNZg/s320/blue+%25281%2529.jpg")');
    }).fadeTo('slow', 1);
});