JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<div id="div"><img alt="Test_Form_4 distorded border - Original image" id="img11" class="internal default" src="https://developer.mozilla.org/files/8467/Test_Form_4_irregular-shape_opacity-gradient.png"  /></div>

CSS

body, div {
  top: 0px;
  margin: 0px; 
  width: 100%;
  height: 500px;
  min-height: 100%;
  border: 1px solid;
}
img {
  filter: drop-shadow(16px 16px 10px black);
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-top: 6%;
}

JavaScript

$('#div').mousemove(function( event ) {
  var img = $('#img11');
  var offset = img.offset();
  img.css('filter', 'drop-shadow(' + (offset.left - event.pageX + (img.width() / 2)) + 'px ' + (offset.top - event.pageY + (img.height() / 2)) + 'px 5px black)');
});