css-波纹列表结束效果

Question

我尝试制作列表的材料设计的涟漪效果，当尝试滑动时显示，这是结束，不可能滑动更多。 我做了

div{
    height: 300px; 
    width: 50px; 
    position: absolute; 
 
    border-radius: 0px 500px 500px 0; 
    -moz-border-radius: 0px 500px 500px 0; 
    -webkit-border-radius: 0px 500px 500px 0; 
    background-color: black; 
    opacity:0.1;
  
  }

<div>
  </div>

它看起来像一个圆角的盒子。我通过改变宽度和不透明度来使用js来产生效果。 如何使css看起来更像效果？

由于