鼠标经过菜单特效

.thisMenu{
  display: inline-block;
  >a{
    color:#fff;
    position: relative;
    display: inline-block;
    height: 64px;
    line-height: 64px;
    transition: 0.5s;
    padding: 0 20px;
    margin: 0 16px;
    font-size: 15px;

    &:before {
      content: "";
      position: absolute;
      width: 100%;
      height: 2px;
      bottom:0;
      left: 0;
      background-color: #fff;
      visibility: hidden;
      transform: scaleX(0);
      transition: all 0.3s ease-in-out 0s;
    }


    &.active{
      color:#fff;
    }

    &.active:before{
      visibility: visible;
      -webkit-transform: scaleX(1);
      -o-transform: scaleX(1);
      transform: scaleX(1);
    }

    &:hover:before{
      visibility: visible;
      -webkit-transform: scaleX(1);
      -o-transform: scaleX(1);
      transform: scaleX(1);
    }

  }
}