Welcome to the DFO World Wiki. With many major updates since the release of DFO, many items are missing. Visit Item Database Project to learn more.
Please remember to click "show preview" before saving the page.
Thanks for the updated logo snafuPop!

Difference between revisions of "User:No.5972/common.css"

From DFO World Wiki
Jump to: navigation, search
Line 36: Line 36:
  
 
@-webkit-keyframes marquee {
 
@-webkit-keyframes marquee {
   from {left:100%}
+
   0%{left:100%}
   to {left: -150%}
+
   100%{left: -150%}
 
}
 
}
 
@-moz-keyframes marquee {
 
@-moz-keyframes marquee {
   from {left:100%}
+
   0%{left:100%}
   to {left: -150%}
+
   100%{left: -150%}
 
}
 
}
 
@-ms-keyframes marquee {
 
@-ms-keyframes marquee {
   from {left:100%}
+
   0%{left:100%}
   to {left: -150%}
+
   100%{left: -150%}
 
}
 
}
 
@-o-keyframes marquee {
 
@-o-keyframes marquee {
   from {left:100%}
+
   0%{left:100%}
   to {left: -150%}
+
   100%{left: -150%}
 
}
 
}
 
@keyframes marquee {
 
@keyframes marquee {
   from {left:100%}
+
   0%{left:100%}
   to {left: -150%}
+
   100%{left: -150%}
 
}
 
}
 +
@-webkit-keyframes marquee {
 +
  0%{left:100%}
 +
  100%{left: -150%}
 +
}
 +
@-moz-keyframes marquee {
 +
  0%{left:100%}
 +
  100%{left: -150%}
 +
}
 +
@-ms-keyframes marquee {
 +
  0%{left:100%}
 +
  100%{left: -150%}
 +
}
 +
@-o-keyframes marquee {
 +
  0%{left:100%}
 +
  100%{left: -150%}
 +
}
 +
@keyframes marquee {
 +
  0%{left:100%}
 +
  100%{left: -150%}
 +
}
 +
 
.marquee {
 
.marquee {
  width: 100%;
 
  background: #ffffff;
 
 
   height: 30px;
 
   height: 30px;
 +
 +
  overflow: hidden;
 +
  position: relative;
 +
}
 +
 +
.marquee div {
 +
  display: block;
 +
  width: 200%;
 +
  height: 30px;
 +
 
 +
  position: absolute;
 +
  overflow: hidden;
 +
 
   -webkit-animation: marquee 8s linear infinite;
 
   -webkit-animation: marquee 8s linear infinite;
 
   -moz-animation: marquee 8s linear infinite;
 
   -moz-animation: marquee 8s linear infinite;

Revision as of 11:17, 26 January 2016

.csstest1 {
    font-size:22px;
}

.mask
{
width:2000px;
height:2000px;
background:#ffffff;
position:absolute;
transform:translateX(2000px);
visibility:hidden;
animation:welcome 7s;
-moz-animation:welcome 7s; /* Firefox */
-webkit-animation:welcome 7s; /* Safari and Chrome */
-o-animation:welcome 7s; /* Opera */
}

@keyframes welcome
{
from {transform:translateX(0px);visibility:visible;}
to {transform:translateX(2000px);visibility:visible;}
}

@-webkit-keyframes welcome
{
from {transform:translateX(0px);visibility:visible;}
to {transform:translateX(2000px);visibility:visible;}
}

@-ms-keyframes welcome
{
from {transform:translateX(0px);visibility:visible;}
to {transform:translateX(2000px);visibility:visible;}
}

@-webkit-keyframes marquee {
  0%{left:100%}
  100%{left: -150%}
}
@-moz-keyframes marquee {
  0%{left:100%}
  100%{left: -150%}
}
@-ms-keyframes marquee {
  0%{left:100%}
  100%{left: -150%}
}
@-o-keyframes marquee {
  0%{left:100%}
  100%{left: -150%}
}
@keyframes marquee {
  0%{left:100%}
  100%{left: -150%}
}
@-webkit-keyframes marquee {
  0%{left:100%}
  100%{left: -150%}
}
@-moz-keyframes marquee {
  0%{left:100%}
  100%{left: -150%}
}
@-ms-keyframes marquee {
  0%{left:100%}
  100%{left: -150%}
}
@-o-keyframes marquee {
  0%{left:100%}
  100%{left: -150%}
}
@keyframes marquee {
  0%{left:100%}
  100%{left: -150%}
}

.marquee {
  height: 30px;

  overflow: hidden;
  position: relative;
}

.marquee div {
  display: block;
  width: 200%;
  height: 30px;
  
  position: absolute;
  overflow: hidden;

  -webkit-animation: marquee 8s linear infinite;
  -moz-animation: marquee 8s linear infinite;
  -ms-animation: marquee 8s linear infinite;
  -o-animation: marquee 8s linear infinite;
  animation: marquee 8s linear infinite;
}