Question

我有一个index.html页面，页面中央有一个水平导航栏。有6个导航按钮（about_us，faqs等等....）。现在在导航栏上方有一个名为＃container_1的div，在导航栏下方有一个名为＃container_2的div。

到目前为止我已经获得了代码，因此我的导航栏会使用jQuery将相应的html内容加载到导航栏上方的div＃container_1中。

然而，我需要做的是当我点击相应的导航按钮时，BOTH divs将同时加载他们各自的html页面。

例如，当我点击about_us按钮时，它会将“about_us.html＃content”加载到div＃container_1以及将“about_us_2.html #content”加载到div container_2中。

肯定有一些我想念的简单。

到目前为止，我已粘贴了我的代码。

我的jQuery：

$(document).ready(function() {
$('#navigation a').click(function() {
  $('#slider_1').hide();
  $('#slider_1').load($(this).attr('href')).slideDown(1000);
  return false; 
}).eq(0).click();
});

我的HTML代码：

<div id="container_1">
<div id="slider_1"></div>

<div id="navigation">
<a href="aboutus.html#content"><img src="images/btn_aboutus.jpg" border="0" /></a> etc etc etc ...

<div id="container_2">
<div id="slider_2"></div>
</div>

有什么想法吗？

Answer 1

你可以试试这段代码：

http://codepen.io/anon/pen/qdwLC

一次将2个html页面加载到单独的div中

1 个答案: