.ripple {
  background-image: url(https://images.unsplash.com/photo-1608248543803-ba4f8c70ae0b?q=80&w=2253&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100vw;
  height: 100vh;
}

$('.ripple').ripples({
  interactive: false,
});

let count = 0;
const f_drop = setInterval(() =>{
  const x = Math.random() * $('.ripple').outerWidth();
  const y = Math.random() * $('.ripple').outerHeight();
  const dropRadius = 80;
  const strength = 0.04 + Math.random() * 0.04;
  $('.ripple').ripples('drop', x, y, dropRadius, strength);

  count++;
  if(count > 5){
    clearInterval(f_drop);
  }
},500);