JavaScript 自己手写实现一个弹窗

项目中有很多地方会使用到弹窗，现在咱们自己写一个有弹出效果的弹窗.
html 部分一个按钮 一个弹窗盒子 一个蒙板层代码：

js 部分当按钮被点击的时候这个弹窗的盒子出现，并且有个弹出的效果，蒙版层遮住主体部分，突出弹出部分。这个通过给弹窗盒子添加一个class来实现。弹出效果使用一个动画。

css:

.tipShow
{
    opacity:1;
    transition: opacity .5s;
    border: 1px solid #dddddd;
    animation:showPanel .5s ease
}
/**动画部分**/
@keyframes showPanel
{
    0%   {transform:scale(0.5);opacity:0.0;}
    50%  {transform:scale(1.05);opacity:1.0;}
    100% {transform:scale(1);opacity:1.0;}
}

js: