css抽屉式动画效果（笔记）

     css抽屉式动画效果（笔记）          三个div切换.c_right{position:relative;width:97%;height:100%;//display:grid;//grid-template-rows:13%25%32%30%;animation:c_right60slinearinfinitenormal;}@keyframesc_right{0%{left:0px;opacity:1;}30%{left:0px;opacity:1;}34%{left:100%;opacity:0;}96%{left:100%;opacity:0;}100%{left:0;opacity:1;}}.c2_right{display:none;position:absolute;width:24%;height:100%;//display:grid;//grid-template-rows:13%25%32%30%;animation:c2_right60slinearinfinitenormal;}@keyframesc2_right{0%{left:100%;top:0px;opacity:0;}30%{left:100%;top:0px;opacity:0;}34%{left:76%;top:0px;opacity:1;}64%{left:76%;top:0px;opacity:1;}68%{left:124%;top:0px;opacity:0;}//96%{//left:124%;//top:0px;//opacity:0;//}100%{left:124%;top:0px;opacity:0;}}.c3_right{display:none;position:absolute;width:24%;height:100%;//display:grid;//grid-template-rows:13%25%32%30%;animation:c3_right60slinearinfinitenormal;}@keyframesc3_right{0%{left:100%;top:0px;opacity:0;}64%{left:100%;top:0px;opacity:0;}67%{left:76%;top:0px;opacity:1;}96%{left:76%;top:0px;opacity:1;}100%{left:124%;top:0px;opacity:0;}} -全文完-