Question

I have a click function which grabs the contents of one div and loads it into another. I’d like to add a simple fade to that loading. Here’s what I have so far:

$("ul.portfolio li a").click(function(e) {
e.preventDefault();
var content = $(this).next('.clickContent').html();
$("#container").html(content).fadeIn('slow');
});

It’s not working. The content just loads. Any idea how to get this to animate??

Thanks in advance!

Answer 1

You need to hide the div first:

$("ul.portfolio li a").click(function(e) {
    e.preventDefault();
    var content = $(this).next('.clickContent').html();
    $("#container").hide().html(content).fadeIn('slow'); // added .hide()
});