jQuery插件创建一个侧面部分的菜单,您可以滚动到页面上的不同部分。
HTML
<html> <body> <section id="home" data-section-menu="Home"> <p>Home</p> </section> <section id="about" data-section-menu="About"> <p>About</p> </section> <section id="contact" data-section-menu="Contact"> <p>Contact</p> </section> </body> </html>
CSS
<link rel="stylesheet" href="assets/css/jquery.sectionmenu.css" />
Javascript
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script> <script type="text/javascript" src="assets/js/jquery.fragmentscroll.min.js"></script> <script type="text/javascript" src="assets/js/jquery.sectionmenu.min.js"></script>
<script type="text/javascript">
$(window).load(function() {
$('body').sectionMenu().fragmentScroll();
});
</script>选项
$('body').sectionMenu({
// Show title in the menu
enableTitle: true,
// Outer element
element: 'nav',
// Class and data- name
class: 'section-menu',
// Insert content before the menu
insertBefore: '',
// Insert content after the menu
insertAfter: ''
});