jQuery函數速度控制

Question

我試圖動畫和控制這個功能的速度： 功能改變當前背景不同的一個，現在它瞬間改變...

這是代碼

$(document).ready(function(){ 
     jQuery("#lit").hover(function(){ 
     jQuery("body").css("background-image", "url(img/2.jpg)"); 

       }).mouseleave(function(){ 
       jQuery("body").css("background-image", "url(img/1.jpg)" ); 

        }); 
     }); 

Answer 1

添加過渡

$(document).ready(function(){ 
     jQuery("#lit").hover(function(){ 
     jQuery("body").css("background-image", "url(img/2.jpg)"); 
     jQuery("body").css("transition", "background-image 0.5s ease-in-out"); 

       }).mouseleave(function(){ 
       jQuery("body").css("background-image", "url(img/1.jpg)" ); 
       jQuery("body").css("transition", "background-image 0.5s ease-in-out"); 
        }); 
     });