如何使用jQuery淡出圖片然後進入新頁面？

Question

我的網站的開始頁面是圖片，點擊時我希望它淡出然後轉到主頁面。我是否應該淡化圖片，然後淡入下一頁的正文，或者有辦法將它整合在一起？

<script> 
$(document).click(function(){  
    $('#beach').fadeTo(3000,0.30, function() { 
     $("#beach").attr("src",$("#link").attr("href")); 
    }).fadeTo(500,1); 
    return false; 

}); 
</script> 

<a href="welcomepage.html#link"><img id="beach" src="wedfronttest.jpg" 

在此先感謝

Answer 1

使用Froxz的想法，我認爲最好的辦法是

$("a").click(function(event) { 
    event.preventDefault(); 
    var url = $(this).prop('href'); 
    $('#beach').fadeOut(function() { 
     window.location = url; 
    }); 
}); 

檢查這個JSFiddle看到它在行動！ （請記住，你不會在JSFiddle中重定向，但你會看到這個主意）

Answer 2

$("a").click(function(event) { 
event.preventDefaults(); 
var url = $(this).attr('href'); 
     $('#beach').fadeOut(function() { 
       window.location = url; 
     }); 
    });