将内容加载到div(jQuery),更改URL和从侧边栏导航控制

时间:2012-09-12 12:15:02

标签: html css ajax jquery

这是我的目标。我需要找到一个插件或编写一个执行以下操作的插件:

  • 点击后,从外部文件或隐藏的div加载内容(带淡入效果)
  • 侧边栏导航将用于加载此内容(点击时),因此需要能够将内容加载到自身之外的div中
  • 为链接的内容创建网址,以便我可以直接链接到

为了切入追逐,我需要它拥有Chris Coyier Organic Tabs的所有功能。我有两页供您查看。一个使用有机标签而另一个没有。我无法在第二页上使用“有机选项卡”的原因是因为我不知道如何使用#tabs div之外的内容。也许这个插件是可能的,也许不是。以下是两页的链接:

  1. 有机标签页:http://ncfic.steadfastdesignfirm.com/events/event.php
  2. 点击侧边栏中的项目时需要使用ajax功能加载内容的新页面:http://ncfic.steadfastdesignfirm.com/events-2/overview.php
  3. 为了澄清一点,我在引用的第一页上不需要任何帮助。这只是为了说明我希望第二页能够做什么,使用侧边栏导航,而不是标签结构。

    更新:这是一个代码为http://jsfiddle.net/taylortsantles/pC2SF/的jsfiddle。

    非常感谢任何帮助。如果您有任何其他问题,请告诉我。

    谢谢,泰勒

1 个答案:

答案 0 :(得分:2)

保持UI部分,jquery实现看起来像

$('#link').click(function(){
    $('#inner').fadeOut('slow',function(){
        $('#inner').html($('#hidden').html());
        $('#inner').fadeIn('slow');
    })            
})

链接到JSFiddle example