使用多个div拼完整的背景图

应用多个div拼残缺的背景图

需要,依据时长来展现音频图,依据音频时长来展现相应的帧图.(不须要裁剪背景图.一张图片依据css3属性来展现)

间接放代码:

<div
  class="backgroundImg"
  v-show="!item1.is_noisereduc"
  :style="{
    background:
      'url(' + item1.frame_img_url + ') no-repeat ',
    'background-position-x':
      (
        item1.self_start_time /
        (item1.alltime -
          item1.self_end_time +
          item1.self_start_time)
      ).toFixed(2) *
        100 +
      '%',
    'background-position-y': '0%',
    'background-size':
      (item1.alltime /
        (item1.self_end_time - item1.self_start_time)) *
        100 +
      '% 50px', //200 -50
    'background-position-y': '100%'
  }"
>
</div>`


次要应用background-position-x,来计算出地位百分比等  计算比较复杂.


` `