jQuery分步步骤

所属分类:其他-独立的部件,杂项

 52203  504  查看评论 (11)
分享到微信朋友圈
X
jQuery分步步骤 ie兼容6

使用方法

1.引入样式和脚本

<link rel="stylesheet" type="text/css" href="css/jquery.step.css" />
<script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<script src="js/jquery.step.min.js"></script>

2.初始化插件

var $step = $("#step");
$step.step({
   index: 0,
   time: 500,
   title: ["填写申请表", "上传资料", "待确认", "已确认", "预约完成"]
});

3.方法

$step.getIndex();// 获取当前的index
$step.prevStep();// 上一步
$step.nextStep();// 下一步
$step.toStep(index);// 跳到指定步骤
相关插件-独立的部件,杂项

html5手势解锁插件H5lock.js

html5手势解锁插件H5lock.js详细注释
  独立的部件
 37564  368

可停靠屏幕边缘的侧边栏插件

我自己封装的可停靠屏幕边缘的侧边栏插件,可以制作页面的通知信息,客服信息,联系方式等
  独立的部件
 36725  452

后台管理框架

后台管理框架基于bootstrap
  独立的部件
 88721  591

jQuery实现弹幕实例

一个很好用的实例,适合新手
  独立的部件
 29234  332

讨论这个项目(11)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    故人北 0
    2020/7/19 19:01:52
    为什么设置宽度为100% 步骤5会被挤下去
    回复
    superdameng 0
    2020/5/11 17:05:30
    我想问下,哪里有不压缩的js代码 回复
    422835426 0
    2020/2/11 19:51:56
    怎么在每步里面放内容啊
        superdameng0
        2020/5/11 17:02:39
        我实在js里动态添加到dom里
        Shylock0
        2020/6/24 16:25:39
        <div id="wizard">
            <h1>第一步</h1>
            <div class="step-content">
                <div class="text-center m-t-md">
                    <h2>第一步</h2>
                    这是第一步的内容
                </div>
            </div>
            <h1>第二步</h1>
            <div class="step-content">
                <div class="text-center m-t-md">
                    <h2>第二步</h2>
                    这是第二步的内容
                </div>
            </div>
            <h1>第三步</h1>
            <div class="step-content">
                <div class="text-center m-t-md">
                    <h2>第三步</h2>
                    这是第三步的内容
                </div>
            </div>
        </div>
    回复
    Homeless 0
    2018/10/20 18:15:32
    已下载,谢谢分享 回复
    十位游戏号 0
    2018/7/11 10:01:42
    这个怎么初始化啊?
    回复
    朝歌 0
    2018/6/8 11:01:39
    终极之旅 0
    2018/1/26 17:56:39

    这个并不支持IE6、7,在IE8中圆角效果消失

        哦买噶0
        2018/8/27 10:26:51
        是不是,这就坑了吧
        wwf0
        2019/11/27 15:25:09
        能用吗?
    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复