前言:
根据最大值显示百分比,而不是用接口返回回来的结果做前端的效果展示
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8" />
<title>根据最大值显示百分比</title>
<style>
.item{
border: 1px solid red;
}
.item p{
position: relative;
height: 20px;
}
.item p span{
position: absolute;
top: 0;
width: 10%;
height: 100%;
background: red;
}
</style>
</head>
<body>
<div class="item">
<p><span></span></p>
</div>
<script src="jquery.min.js"></script>
<script>
var arr=[]
var sd=[
{name:'成都','wek':6},
{name:'巴中','wek':2},
{name:'德阳','wek':8}
]
for(var i=0,len=sd.length;i<len;i++){
arr.push(sd[i].wek);
}
arr.sort(function (a, b) {
return a-b;
});
var max = arr[arr.length - 1];
var shtml='';
for(var z=0,zlen=sd.lengh;z<len;z++){
shtml+='<p><span style="width:'+(sd[z].wek/max*100)+'%"></span></p>';
}
$('.item').html(shtml)
</script>
</body>
</html>
6085
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
