javascript - 单击 anchor 标记时淡入和淡出

Question

我有一个页面，当单击菜单上的 anchor 标记时，它会使用 php 加载内容，并且工作正常。

这几天我一直在寻找答案。

我必须使用哪些代码才能从一种内容淡出到另一种内容？我到底应该在哪里添加这段代码？

这是我的代码:

$(document).ready(function() {
    // Set trigger and container variables
    var trigger = $('#centerMenu div a'),
        container = $('#content');

    // Fire on click
    trigger.on('click', function() {
        // Set $this for re-use. Set target from data attribute
        var $this = $(this),
            target = $this.data('target');

        // Load target page into container
        container.load(target + '.php');

        // Stop normal link behavior
        return false;
    });
});

Answer 1

您也可以使用这个:

$(document).ready(function() {
        // Set trigger and container variables
        var trigger = $('#centerMenu div a'),
            container = $('#content');

        // Fire on click
        trigger.on('click', function() {
            // Set $this for re-use. Set target from data attribute
            var $this = $(this),
                target = $this.data('target');

            // Load target page into container
            container.fadeOut(250);
            container.load(target + '.php').fadeIn(500);

            // Stop normal link behavior
            return false;
        });
    });