0

因此，我有 5 个投资组合项目，当用户单击一个项目时，我希望发生的是项目详细信息页面动画并加载到页面上。现在，我已经快速了解了我认为这可以如何工作，但不确定这是否是可行的方法。如果我这样做的话，也不确定我应该如何为不同的项目加载不同的内容..

现在，当单击其中一个投资组合项目时，我只是在整个页面上为隐藏的 div 设置动画。这是一个小提琴，所以你们有一个更好的主意：

http://jsfiddle.net/MF32t/1/

$(document).ready(function() {
$('.portfolio__project').click(function() { 
    $('.projectDetails').css({"display":"inline"});
    $('.projectDetails').animate({"width":"100%"}, 750);
    $('.projectDetails').delay(500).animate({"height":"100%"}, 750);
});

});

是要走的路吗？还是我应该换个方向思考？不需要准备好运行代码，只需要朝着正确的方向推进。

谢谢！

4

1 回答 1

0

您可以使用 ajax 来加载内容。草稿可能看起来像这样

function loadProject(projectID) {
  $.post(
    "loadProject.php",
    {
      projectID: projectID
    },
    function(content) {
      // Set the content
      $("#content").html(content); // and animations
    }
  );
}

您也可以仅在主容器中加载项目详细信息，无需隐藏整个页面。加载内容时淡出旧内容，设置新内容并淡入新内容（例如）。这里是你的选择

于 2013-10-09T13:32:57.807 回答