去掉了popover，感觉真心弹出提示真心不好用。
另外，空间的宽度过窄，暂时改成手动调节，需要使用者自定义宽度以及空间的宽度。
布局方法：
计算方法，每个原点之间的距离为x，共有y个原点。则：
- 进度条容器的宽度为 x*y px
- 进度条的宽度以及进度条容器宽度为x*(y-1) px
- 按钮偏移值为 x*y px
/*添加相应式CSS*/
@media (min-width: 768px) {
/*调节总的宽度*/
.ystep-lg {
width: 400px;
}
/*调节进度条宽度*/
.ystep-lg .ystep-progress, .ystep-lg .ystep-progress-bar {
width: 300px;
}
/*调节各个原点之间的跨度*/
.ystep-lg li {
margin-right: 0px;
}
/*调节按钮位置*/
.step-button{
left: 400px;
}
}
@media (min-width: 992px) {
/*调节总的宽度*/
.ystep-lg {
width: 600px;
}
/*调节进度条宽度*/
.ystep-lg .ystep-progress, .ystep-lg .ystep-progress-bar {
width: 450px;
}
/*调节各个原点之间的跨度*/
.ystep-lg li {
margin-right: 50px;
}
/*调节按钮位置*/
.step-button{
left: 600px;
}
}
@media (min-width: 1200px) {
/*调节总的宽度*/
.ystep-lg {
width: 800px;
}
/*调节进度条宽度*/
.ystep-lg .ystep-progress, .ystep-lg .ystep-progress-bar {
width: 600px;
}
/*调节各个原点之间的跨度*/
.ystep-lg li {
margin-right: 100px;
}
/*调节按钮位置*/
.step-button{
left: 800px;
}
}$(".ystep").loadStep({
steps:["发起","审核","募款","执行"],
beforeChange: function(nowIndex,nextIndex){
console.log("跳转前校验:"+nowIndex +" "+nextIndex);
if(nowIndex === 1 && nextIndex === 2 ){
return true;
}else if(nowIndex === 2 && nextIndex === 3){
return true;
}else if(nowIndex === 3 && nextIndex === 4){
return true;
}
return true;
},
afterChange: function(nowIndex,prevIndex){
console.log("跳转后动作:"+nowIndex +" "+prevIndex);
if(nowIndex <1 || nowIndex >5) return;
/*for(var i = 1; i <= 5; i++){
if(i === nowIndex){
$("#page"+i).css("display","block");
}else{
$("#page"+i).css("display","none");
}
}*/
if(nowIndex === 2 && prevIndex === 1){
}else if(nowIndex === 3 && prevIndex === 2){
}else if(nowIndex === 4 && prevIndex === 3){
}
}
});
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent