Question

$('.overview li a').click(function(){
        $('#large-img').html("<img src=" + $(this)
                           .attr('href') + "/>" + "<br /><div>" + $(">.desc",this)
                           .html()); //HOW TO FADEIN this
        return false;
        });

Answer 1

.fadeIn()只能在jQuery集合上调用。 html()返回一个字符串，因此无法使用它。一种可能的途径是从HTML（您想要插入）创建一个jQuery集合，隐藏它，然后将其附加到其位置并淡入。

此代码执行此操作：

$('.overview li a').click(function(){
    var $newstuff=
        $("<img src=" 
        + $(this).attr('href') 
        + ">"
        + "<br><div>" 
        + $(">.desc", this).html()
        + '</div>').hide();

    $('#large-img').append($newstuff.fadeIn('slow'));
    return false;
});

jsFiddle Demo

相同的代码更多jQuery-ish方式：

$('.overview li a').click(function(){  
    $('<img>').attr('src', $(this).attr('href'))
        .add('<br>')
        .add($('<div>').html($(">.desc", this).html()))
        .hide()
        .appendTo($('#large-img'))
        .fadeIn('slow'); 
    return false;
});

jsFiddle Demo 2

Answer 2

尝试一下：

$('.overview li a').click(function(){
    var a = this;
    var img = $("<img src='" + $(this).attr('href') + "'/>" +  "<br /><div>");
    $('#large-img').hide('fast', function(){ 
        $(this).html(img + $(">.desc", a)).show('fast'); 
    });
    return false;
});

如何淡化.html（）

2 个答案: