title: How to create a teardrop/water drop filling using css and javascript
body: <p>How to create a teardrop/water drop filling using the css and javascript dynamically filling the water.</p>
  
  <p>for example.</p>
  
  <p><a href="https://i.stack.imgur.com/JR8uv.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/JR8uv.png" alt="enter image description here"></a></p>
  
  <p>it will fill the water/tear drop depends on the percentage.</p>
  
  <p>example when the percentage is 100% it will full the water/tear drop.</p>