這是一個示例代碼。在這裏,我在這裏使用了jQuery。我在索引頁中將每個頁面的內容包含在單獨的DIV中。然後單擊我的導航欄中的菜單顯示頁面的內容。我希望這會給你一個想法。 :)
的JScript:
<script type="text/javascript">
$('.nav_button').click(function(){
var page = $(this).text().toLowerCase();
$('#content').html($('#'+page+'_page').html()); //display content of div(that holds the content of the respective page) in the "conetent" div
$('html, body').animate({scrollTop: $("#navbar").offset().top}, 'slow'); //scroll back to the top
return false;
});
</script>
HTML:
<!-- Navigation menu -->
<div id="navbar">
<a class="nav_button" href="#">Home</a>
<a class="nav_button" href="#">About</a>
<a class="nav_button" href="#">Contact</a>
</div>
<div id="content">
<!-- Here page content will be displayed -->
</div>
<!-- This div holds the contents of each page -->
<div style="display:none;">
<!-- Contact Page -->
<div id="contact_page">
You can contact me through this email....
</div>
<!-- About Page -->
<div id="about_page">
About me? I love coding...
</div>
<!-- Home Page -->
<div id="home_page">
Yo! You are at my home page. Check out my whole site and enjoy :)
</div>
</div>
我希望這將有助於:) 如果你想看到它在行動,後藤:www.magcojennus.co.cc(這是一個網站,我已經創建了我的大學日:))
我不明白問題 – kappa 2012-04-11 10:23:50
編號PHP無法訪問div屬性的方式。 – Dutchie432 2012-04-11 10:25:07
我明白了。我知道Javascript和jQuery可以做到這一點...但我可以得到它顯示一整塊HTML? – Miro 2012-04-11 10:31:47