注册    登录
最新消息: 本以为花钱买了那个amh的板面可以让网站更稳定,结果搞得整 个网站运行出错,真是赔了夫人又折兵,对不起大家了。最新版jquery-2.1.1下载  ,在线的 jquery API使用手册, 稳定版jquery.mobile-1.3.2下载

jQuery右则全屏滚动菜单插件Section Menu

动画 fishcity 2556浏览

jQuery右则全屏滚动菜单插件Section Menu

Section Menu是一款悬浮在右则让网页整屏滚动不同部分的菜单插件,Section Menu可以实现背景不变,点击菜单,网页将滚动到相应的内容区域。

使用方法

引入核心文件

<link rel="stylesheet" href="assets/css/jquery.sectionmenu.css" />
<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>

构建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>

写入JS初始化

$(window).load(function() {
    $('body').sectionMenu().fragmentScroll();
});

选项

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

转载请注明:jQ酷 » jQuery右则全屏滚动菜单插件Section Menu

下载地址:本站下载 | 百度云 | 官方下载
下载说明:
☉如果您发现本文件已经失效不能下载,请联系站长修正!
☉如果您下载的文件出现解压不了或文件受损等情况,请选择其他下载点重新下载。
☉下载本站资源,如果服务器暂不能下载请过一段时间重试!
☉有小部分资源需要解压密码,请输入:jqcool.net。
☉本站提供的所有资源仅供学习研究与参考,请勿用于商业用途。