“Widget:Test”的版本间的差异

来自萌娘文库
跳转至： 导航、 搜索
小
小
第1行： 第1行：
 
<includeonly><style type="text/css">
 
<includeonly><style type="text/css">
−
.cover {
+
@-moz-keyframes loading {
−
   position: relative;
+
   0%, 100% {
−
  margin: 20px auto;
+
    -moz-transform: scale(1) rotateZ(0deg);
−
   background-color: #f2fdfa;
+
    transform: scale(1) rotateZ(0deg);
−
  z-index: 1;
+
    opacity: 1;
−
  padding: 10px;
+
  }
−
    
+
 
−
   -webkit-box-shadow: 0 2px 10px rgba(0,0,0,0.3);
+
   26% {
−
  -mox-box-shadow: 0 2px 10px rgba(0,0,0,0.3);
+
    -moz-transform: scale(1.1) rotateZ(12deg);
−
  box-shadow: 0 2px 10px rgba(0,0,0,0.3);
+
    transform: scale(1.1) rotateZ(12deg);
 +
    opacity: .2;
 +
   }
 +
 
 +
   76% {
 +
    -moz-transform: scale(0.8) rotateZ(-8deg);
 +
    transform: scale(0.8) rotateZ(-8deg);
 +
    opacity: .6;
 +
  }
 
}
 
}
 +
@-webkit-keyframes loading {
 +
  0%, 100% {
 +
    -webkit-transform: scale(1) rotateZ(0deg);
 +
    transform: scale(1) rotateZ(0deg);
 +
    opacity: 1;
 +
  }
  
−
.left_gate {
+
  26% {
−
  position: absolute;
+
    -webkit-transform: scale(1.1) rotateZ(12deg);
−
  background: #c7f5e8;
+
    transform: scale(1.1) rotateZ(12deg);
−
  bottom: 0; right: 50%; left: 0; top: 0;
+
    opacity: .2;
−
   border:1px solid #F0F0F0;
+
   }
−
   
+
 
−
   -webkit-transition: all 0.5s ease-out;
+
   76% {
−
  -moz-transition: all 0.5s ease-out;
+
    -webkit-transform: scale(0.8) rotateZ(-8deg);
−
  -ms-transition: all 0.5s ease-out;
+
    transform: scale(0.8) rotateZ(-8deg);
−
  -o-transition:all 0.5s ease-out;
+
    opacity: .6;
−
   transition: all 0.5s ease-out;
+
   }
 
}
 
}
−
.cover:hover .left_gate {
+
@keyframes loading {
−
   right: 100%; left: -50%;
+
  0%, 100% {
 +
    -moz-transform: scale(1) rotateZ(0deg);
 +
    -ms-transform: scale(1) rotateZ(0deg);
 +
    -webkit-transform: scale(1) rotateZ(0deg);
 +
    transform: scale(1) rotateZ(0deg);
 +
    opacity: 1;
 +
  }
 +
 
 +
  26% {
 +
    -moz-transform: scale(1.1) rotateZ(12deg);
 +
    -ms-transform: scale(1.1) rotateZ(12deg);
 +
    -webkit-transform: scale(1.1) rotateZ(12deg);
 +
    transform: scale(1.1) rotateZ(12deg);
 +
    opacity: .2;
 +
  }
 +
 
 +
  76% {
 +
    -moz-transform: scale(0.8) rotateZ(-8deg);
 +
    -ms-transform: scale(0.8) rotateZ(-8deg);
 +
    -webkit-transform: scale(0.8) rotateZ(-8deg);
 +
    transform: scale(0.8) rotateZ(-8deg);
 +
    opacity: .6;
 +
  }
 +
}
 +
.loader {
 +
  overflow: hidden;
 +
  font-size: 45px;
 +
}
 +
.loader span {
 +
   -moz-animation: loading 1s linear infinite -0.8s;
 +
  -webkit-animation: loading 1s linear infinite -0.8s;
 +
  animation: loading 1s linear infinite -0.8s;
 +
  float: left;
 +
}
 +
.loader .span2 {
 +
  -moz-animation: loading 1s linear infinite -0.2s;
 +
  -webkit-animation: loading 1s linear infinite -0.2s;
 +
  animation: loading 1s linear infinite -0.2s;
 +
}
 +
.loader .span3 {
 +
  -moz-animation: loading 1s linear infinite -0.5s;
 +
  -webkit-animation: loading 1s linear infinite -0.5s;
 +
  animation: loading 1s linear infinite -0.5s;
 +
}
 +
.loader .span4 {
 +
  -moz-animation: loading 1s linear infinite -1.1s;
 +
  -webkit-animation: loading 1s linear infinite -1.1s;
 +
  animation: loading 1s linear infinite -1.1s;
 +
}
 +
.loader .span5 {
 +
  -moz-animation: loading 1s linear infinite -0.36s;
 +
  -webkit-animation: loading 1s linear infinite -0.36s;
 +
  animation: loading 1s linear infinite -0.36s;
 +
}
 +
.loader .span6 {
 +
  -moz-animation: loading 1s linear infinite -0.65s;
 +
  -webkit-animation: loading 1s linear infinite -0.65s;
 +
  animation: loading 1s linear infinite -0.65s;
 +
}
 +
.loader .span7 {
 +
  -moz-animation: loading 1s linear infinite -0.93s;
 +
  -webkit-animation: loading 1s linear infinite -0.93s;
 +
  animation: loading 1s linear infinite -0.93s;
 
}
 
}
  
−
.right_gate {
+
.font1 {
−
   position: absolute;
+
   font-family: "Helvetica", Arial, sans-serif;
−
  background: #c7f5e8;
 
−
  bottom: 0;
 
−
  left: 50%;
 
−
  right: 0;
 
−
  top: 0;
 
−
  border:1px solid #F0F0F0;
 
−
 
 
−
  -webkit-transition: all 0.5s ease-out;
 
−
  -moz-transition: all 0.5s ease-out;
 
−
  -ms-transition: all 0.5s ease-out;
 
−
  -o-transition: all 0.5s ease-out;
 
−
  transition: all 0.5s ease-out;
 
 
}
 
}
−
.cover:hover .right_gate {
+
 
−
   left: 100%; right: -50%;
+
.font2 {
 +
   font-family: Impact;
 
}
 
}
  
−
.slide_in {
+
.font3 {
−
   overflow: hidden;
+
   font-family: "Webdings";
 
}
 
}
−
.slide_in .left_gate {
+
 
−
   background: #c7f5e8;
+
.font4 {
−
   border:1px solid #F0F0F0;
+
   font-family: "Comic Sans MS", sans-serif;
 +
   font-weight: bold;
 
}
 
}
−
.slide_in .right_gate {
+
</style></includeonly>
−
  background: #c7f5e8;
 
−
  border:1px solid #F0F0F0;
 
−
}</style></includeonly>
 

2016年9月11日 (日) 00:25的版本

取自“https://library.moegirl.org.cn/index.php?title=Widget:Test&oldid=2679”