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">