一款基于css3和jquery实现的动画显示弹出层按钮教程

2020-05-09 06:59:32易采站长站整理

            background-color: transparent;   
            top: 50%;   
            left: 50%;   
            -webkit-transform: translate(-50%, -50%);   
            -ms-transform: translate(-50%, -50%);   
            transform: translate(-50%, -50%);   
            -webkit-transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);   
            transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);   
            cursor: pointer;   
        }   
        .opened .papersheet__trigger   
        {   
            background-color: #eceff1;   
            top: 10%;   
        }   
        .papersheet__trigger:hover   
        {   
            box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.5);   
        }   
        .papersheet__trigger:active:before   
        {   
            background-color: #d5d5d5;   
        }   
        .papersheet__trigger:before   
        {   
            content: "";   
            background-color: #eceff1;   
            display: block;   
            position: absolute;