/OpenSource

jQuery Section Menu


The jQuery section menu plugin creates a side menu that allows you to scroll to the different sections on the page. Check the demo for more information.

Example

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 type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/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>

Options

$('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: ''
});

Statistieken

17 7 15 2

Laatst bijgewerkt

1 February 2018

Talen

Labels

,