jQuery-帶Php變量的圖像淡入

Question

我在大圖下方有縮略圖。 單擊縮略圖時，需要淡出當前的大圖像，並淡入縮略圖的大圖像。 所有圖像和縮略圖均已從數據庫中拉出。

最好的方法是什么？

$(document).ready(function(){
    $('.thumbnail').live('click', function(){
        var self = this;
        $('#hero img').fadeOut(function(){
            $('#hero img').attr('src', self.src.replace('50x50', '572x362')).fadeIn();
        });
   });
});

Answer 1

使用jQuery的客戶端看起來類似於：

$('.thumbnail').live('click', function(ev){
   ev.preventDefault();
   var self = this;
   $('.largeImage').fadeOut(function(){
      $('.largeImage').attr('src', self.src.replace(/_sm/, '_lg')).fadeIn();
   });
});

然后，您的PHP僅使用<img class="thumbnail" src="some_img_sm.jpg">和一些div <img class="largeImage">