JQuery：你可以为.load 添加过渡效果吗

Question

我的工作进展缓慢，不断尝试不同的方法。

快问...

是否可以将 .fadein .fadeout .slideup .slidedown 等 jquery 动画效果添加到 onclick .load。

当我点击一个链接时，页面只是在我指定的区域加载，但我不知道如何将效果绑定到这个 .load。

有什么建议？

编辑：代码示例：

$(document).ready(function(){ 
    // load home page when the page loads
    $("#main_content_inner").load("home.html");

    $("#page1").click(function(){
        // load page1 in main_content_inner on click
        $("#main_content_inner").load("page1.html");
    });
    $("#page2").click(function(){
        // load page2 in main_content_inner on click
        $("#main_content_inner").load("page2.html");
    });
    $("#page3").click(function(){
        // load page3 in main_content_inner on click
        $("#content").load("page3.html");
    });
});

编辑：来自 HTML 文件的片段：

//页面应该显示在哪里

    <div id="main_content_inner">
        <h1>
            Main Content
        </h1>
    </div>

//用户选择页面的侧边栏菜单

            <ul id="sidebar_menu">

            <p><li id="page1"> page1</li></p>

            <p><li id="page2"> page2</li></p>

            <p><li id="page3"> page3</li></p>

          </ul>

此代码当前在我的主页上指定的 div 中加载 html 文档。我想这样做，但需要过渡。

我选择加载整个 html 文档而不是从文档中加载特定内容，因为我发现当我在文档的特定内容中包含 javascript，然后尝试将它加载到我的主页上时，javascript（即 Twitter 推文）不会展示。但是当我单独打开 html 文件时，它会正常工作，所以似乎 ajax 会将 javascript 加载到我的主页上的内容 div 中。

关于使此代码更适合我的需要等的任何建议......我愿意接受批评，尤其是建议，因为它完全是关于学习的。

谢谢

Answer 1

$('.element').click(function()
{
    $('.load').load('url').hide().fadeIn('slow');
});