Day407: 有一堆整数,请把他们分成三份,确保每一份和尽量相等(11,42,23,4,5,6 4 5 6 11 23 42 56 78 90)
qappleh opened this issue · comments
Day407: 有一堆整数,请把他们分成三份,确保每一份和尽量相等(11,42,23,4,5,6 4 5 6 11 23 42 56 78 90)
借用了瀑布流的**
<style>
body {
width: 100%;
height: 100%;
}
.axsis{
width: 680px;
margin: 0 auto;
background-color: #ebedf0;
display: flex;
justify-content: space-between;
min-height: 300px;
}
.item{
width: 200px;
transition-duration: 1s;
height: 0px;
display: flex;
justify-content: center;
align-items: center;
font-size: 24px;
color: #fff;
font-weight: bold;
}
</style>
<div class="axsis">
<div class="item" style="background-color: #1989fa;"></div>
<div class="item" style="background-color: #fa1989;"></div>
<div class="item" style="background-color: #8919fa;"></div>
</div>
window.onload = function(){
let arr = [11, 42, 23, 4, 5, 6, 4, 5, 6, 11, 23, 42, 56, 78, 90];
arr.sort((a,b)=>{
return b-a;
});
let divs = document.querySelectorAll('.item');
let index = 0;
let timer = setInterval(() => {
if(index==arr.length){
clearInterval(timer);
console.log('OVER');
return ;
}
let h1 = parseInt(divs[0].style.height||0);
let h2 = parseInt(divs[1].style.height||0);
let h3 = parseInt(divs[2].style.height||0);
let minIndex = 0;
let min = h1;
for(let i=1;i<divs.length;i++){
if(min>parseInt(divs[i].style.height||0)){
minIndex = i;
min = parseInt(divs[i].style.height||0);
}
}
let height = parseInt(divs[minIndex].style.height||0) + arr[index] + 'px'
divs[minIndex].style.height = height;
divs[minIndex].innerHTML = height
index++;
}, 800);
}