jquery鼠标点页面出现水波纹特效

$(document).click(function(e) {
  var size = 120
  $('body').append("<div class='wave'>")
  $('.wave').css({
    position: 'fixed',
    left: e.clientX,
    top: e.clientY,
    borderRadius: size + 'px',
    border: '1px solid black',
  }).stop().animate({
    width: size,
    height: size,
    left: e.clientX - size / 2,
    top: e.clientY - size / 2,
    opacity: '0'
  }, function() {
    $('body .wave').remove()
  })
})