/*two*/ .clear { clear:both; } p { margin:0; } .marks { width:100%; height:100%; background-color:#000; opacity:0.5; position:fixed; top:0; left:0; display:none; } .popup,.popup2,.popup3 { width:300px; position:fixed; top:20%; left:50%; margin-left:-150px; background-color:#fff; display:none; animation:shake 1s; } .popup2 { animation:mymove 1s; } .popup3 { animation:contentSlipToBottom 1s; } .popup-top { padding:10px 0; box-sizing:border-box; color:#000; border-bottom:1px solid #0099ff; margin:0 15px; } .popup-top p,.popup-top span { float:left; display:block; width:50%; text-align:right; } .popup-top span { cursor:pointer; } .popup-top p { text-align:left; } .popup-content { padding:20px 25px; text-align:center; } .pop-botton { width:60%; margin:0 auto; margin-bottom:15px; } .pop-botton .ok { width:48%; float:left; margin-right:4%; color:#fff; background-color:#0099ff; cursor:pointer; text-align:center; border-radius:5px; } .pop-botton .cancel { width:48%; float:left; background-color:#e7e7e7; color:#000; cursor:pointer; text-align:center; border-radius:5px; } /*动画*/ @keyframes shake { 0%,100% { -webkit-transform:translateX(0); } 10%,30%,50%,70%,90% { -webkit-transform:translateX(-10px); } 20%,40%,60%,80% { -webkit-transform:translateX(10px); } }@keyframes mymove { 0% { transform:scale(1); } 50% { transform:scale(1.1); } 100% { transform:scale(1); } }@keyframes contentSlipToBottom { 0% { transform:rotateX(90deg); } 100% { transform:rotateX(0deg); } }
更新时间:2019-09-25 08:53:16
首先要引入jq文件,复制代码即可!