查看: 208|回复: 0

mui中滑动选项卡的mui-slider-progress-bar滑动位置错误问题

[复制链接]

474

主题

474

帖子

999万

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
9995166
发表于 2019-3-28 13:44:15 | 显示全部楼层 |阅读模式
问题:滑动选项卡的mui-slider-progress-bar,切换选项卡的时候,<div id="sliderProgressBar" class="mui-slider-progress-bar mui-col-xs-4"></div>这个东西,滑动的距离是屏幕的宽,导致横条滑出屏幕了,应该是滑动到下一个选项卡下面?


解决方法:
注意mui-col-xs-4类;
这里使用的是栅格系统,默认12等分,若有3个选项卡,使用mui-col-xs-4;若有4个选项卡,则要用mui-col-xs-3;依次类推;
.mui-col-xs-1, .mui-col-sm-1, .mui-col-xs-2, .mui-col-sm-2, .mui-col-xs-3, .mui-col-sm-3, .mui-col-xs-4, .mui-col-sm-4, .mui-col-xs-5, .mui-col-sm-5, .mui-col-xs-6, .mui-col-sm-6, .mui-col-xs-7, .mui-col-sm-7, .mui-col-xs-8, .mui-col-sm-8, .mui-col-xs-9, .mui-col-sm-9, .mui-col-xs-10, .mui-col-sm-10, .mui-col-xs-11, .mui-col-sm-11, .mui-col-xs-12, .mui-col-sm-12
{   
position: relative;    min-height: 1px;
}
600
.mui-col-xs-12{    width: 100%;}
.mui-col-xs-11{    width: 91.66666667%;}
.mui-col-xs-10{    width: 83.33333333%;}
.mui-col-xs-9{    width: 75%;}
.mui-col-xs-8{    width: 66.66666667%;}
.mui-col-xs-7{    width: 58.33333333%;}
.mui-col-xs-6{    width: 50%;}
.mui-col-xs-5{    width: 41.66666667%;}
.mui-col-xs-4{    width: 33.33333333%;}
.mui-col-xs-3{    width: 25%;}
.mui-col-xs-2{    width: 16.66666667%;}
.mui-col-xs-1{    width: 8.33333333%;}

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|小黑屋|霸气资源网

GMT+8, 2019-10-19 05:01 , Processed in 0.292746 second(s), 34 queries .

Powered by Discuz! X3.4

© 2001-2017 Comsenz Inc.