tab切换效果，滑动tab 点击切换tab标签

tab切换效果，滑动tab 点击切换tab标签

 

演示

• XML/HTML Code

<div class="container">

            <div class="main">
                <div id="cbp-contentslider" class="cbp-contentslider">
                    <ul>

                        <li id="slide2">
                            <h3>freejs</h3>
                            <div>
                                <div class="cbp-content">
                                    <p>freejs.net-Web演示,导航菜单,TAB标签,焦点图,图片特效,分页,表单,网站开发代码演示,批量上传,无刷新 php 处理数据</p>
                                </div>
                            </div>
                        </li>
                        <li id="slide1">
                            <h3>导航菜单</h3>
                            <div>
                                <div class="cbp-content">
                                    <p>各种下拉菜单,导航,多级菜单,右侧展开,左侧展开</p>
                                </div>
                            </div>
                        </li>
                        <li id="slide3">
                            <h3>分页</h3>
                            <div>
                                <div class="cbp-content">
                                    <p><a href="http://www.freejs.net/fenye.html">翻页,分页，无刷新翻页,jquery翻页</a></p>
                                </div>
                            </div>
                        </li>
                        <li id="slide4">
                            <h3>表单</h3>
                            <div>
                                <div class="cbp-content">
                                    <p>表单,jquery更新表单,无刷新更新数据,表单检测,无刷新评论,无刷新留言,联动菜单,上传图片文件,批量上传,jquery上传</p>
                                </div>
                            </div>
                        </li>
                        <li id="slide5">
                            <h3>TAB标签</h3>
                            <div>
                                <div class="cbp-content">
                                    <p>tab标签,选项卡,选卡,jquery选项卡,标签页,动态加载tab</p>
                                </div>
                            </div>
                        </li>
                    </ul>
                    <nav>
                        <a href="#slide1"><span>freejs</span></a>
                        <a href="#slide2"><span>导航菜单</span></a>
                        <a href="#slide3"><span>分页</span></a>
                        <a href="#slide4"><span>表单</span></a>
                        <a href="#slide5"><span>TAB标签</span></a>
                    </nav>
                </div>
            </div>
</div>

 

原文地址:http://www.freejs.net/article_tabbiaoqian_296.html