jQuery Sidebar 侧边栏

在线实例

左边栏

右边栏

使用方法

    <div class="txt">

            <p class="btn">

                <span id="toggle-sidebar">展 开</span>

            </p>

            <p>Simpler Sidebar 是一款简单的 jQuery 侧边栏插件</p>

            <p>请点击按钮查看效果</p>

        </div>

        <div class="sidebar" id="sucaihuo">

            <div class="sidebar-wrapper" id="sidebar-wrapper">

                <ul class="nav">

                    <li><a href="#">手册网</a></li>

                    <li><a href="#">js</a></li>

                    <li><a href="#">素材</a></li>

                    <li><a href="#">模板</a></li>

                    <li><a href="#">联系</a></li>

                </ul>

            </div>

        </div>

        <script src="/api/jq/5733e36361fd7/js/jquery-1.11.3.min.js"></script>

        <script src="/api/jq/5733e36361fd7/js/simpler-sidebar.min.js"></script>

        <script>

            $(function() {

                $('#sucaihuo').simplerSidebar({

                    opener: '#toggle-sidebar',

                    sidebar: {

                        align: 'left',

                        width: 250

                    }

                });

            });

        </script>

　　

---

下载