jquery - JQUERY - 可滚动的网站

Question

这是我的挑战 -

我有一个网站http://www.jodsn.com - 在主页上有 2 个按钮 [查看我的作品] 和 [查看我的技能组]。

当您单击每个按钮时，我想滑出默认页面并滑入工作页面或技能页面。

我不认为 Arial Flesler 的 .ScrollTo 会起作用，因为这似乎针对页面上已经加载的元素。如果我错了，请纠正我。

我将如何在 JQUERY 中完成这项任务？

Answer 1

为什么不定位一个绝对位置为顶部的 div：-（div 的高度）；然后使用滚动到。

然后使用 jquery 在您想要的任何锚点处加载页面。

Answer 2

您可以在函数内部使用 jQuery 的滚动$(document).ready(function(){...});函数。

编辑：

$(document).ready(function()
{
   //Place .scrollTo code here.
});

Answer 3

如果我对您的理解正确，您希望有一些像选项卡式界面一样模糊运行的东西，每个选项卡都通过 ajax 加载并显示动画。

您当然可以使用 jqueryui 之类的插件来做一些简单的事情，但是对于适合您网站风格的东西，我会完全自定义。从这个开始加载内容，然后用它做一些事情：

$.ajax('Skills.aspx', { 
  dataType: 'html'
  success: function(data){ 

    $('#container') // something to hold your content
      .slideUp(400, function(){   // hide existing content
        $(this).empty() // and remove it
        .append(data)   // append new content
        .slideDown();   // and show it
      });

  }
});

同样，这只是为了让你开始。如果内容是轻量级的，您可以从服务器加载所有内容并完全跳过 AJAX 内容。