关于前端:前端实现无序列排序且不能重叠

别离设置色彩、字体大小、用定位来实现不能重叠性能

设置字体大小

Math.floor(Math.random()*10)+10

setColor() {
  var r=Math.floor(Math.random()*256);
  var g=Math.floor(Math.random()*256);
  var b=Math.floor(Math.random()*256);
  return "rgb("+r+','+g+','+b+")";
},
setLeft() {
  return Math.random() * 100 * 3 + 200
},
setTop() {
  if (this.words.length == this.randomTopArr.length) return
  let randomTxt = Math.random() * 100 * 3
  randomTxt = randomTxt > 230 ? randomTxt / 3 : randomTxt
  this.randomTopArr.length && this.randomTopArr.forEach(res => {
    if (Math.abs(res - randomTxt) < 30) {
      randomTxt = res > randomTxt ? randomTxt - 20 : res - 20
    }
  })
  this.randomTopArr.push(randomTxt)
  return randomTxt
}

不能重叠的次要思路是设置top值，只有在肯定范畴内的区间，就不会重叠，用每个随机生成的top值跟曾经存起来的数组每一项进行比照，如果间隔太近，做一下扭转