Question

我有4页内容，我想在当前/主页上打开。所有这些页面都需要插入。例如。一旦点击了我们，它就会滑入，然后点击另一个链接，上一页将滑出，新页面将会滑入。点击主页链接后，任何加载的页面都需要滑出。

我在这里添加了一个插图

这是我试图提出的网站http://www.beautydishphotography.com。

目前所有链接内容都是从驻留在页面本身的DIV上加载的，我试图将这些内容加载到外部HTML文件中，并在单击菜单按钮时将其加载/滑出。

这是我当前的HTML代码。

<html>
<head>
    <title>Test Div</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js" type="text/javascript"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js" type="text/javascript"></script>
</head>
<body>
    <nav> 
    <div id='menu'> 
    <a href='#'><img src='img/Navigation/home.png' title='Home' alt='' /></a>
    <a href='aboutus.html'><img src='img/Navigation/info.png' id="aboutUs" title='About Us' alt='' /></a> 
    <a href='portfolio.html'><img src='img/Navigation/gallery.png' id="portfolio" title='Portfolio' alt='' /></a>
    <a href='contactus.html'><img src='img/Navigation/contact.png' id="contactUs" title='Contact Us' alt='' /></a>
     </div>
  </nav>
  <div style="clear:both"></div>
  <div id="externalPage" style="height:900px; width:900px; background-color:#999; display:none;">Contact Us</div>
</body>
</html>

我还放置了一个#externalPage div，可能需要加载外部的.html文件。

我是jQuery的新手，真的很难实现它。请让我知道我该怎么做。

Answer 1

将您的内容加载到屏幕外或隐身div，然后将.animate() div加载到位。您也可以相应地更改类名，从而将所有样式应用到您带入的div。

GitHub上的人们暂时实现了这个想法： https://github.com/blog/760-the-tree-slider

在当前页面顶部滑动外部页面

1 个答案: