Allen850413 (Talk | contribs) |
Allen850413 (Talk | contribs) |
||
Line 250: | Line 250: | ||
background: none; | background: none; | ||
} | } | ||
− | |||
.scroll a:hover { | .scroll a:hover { | ||
opacity: .5; | opacity: .5; | ||
Line 256: | Line 255: | ||
.a { | .a { | ||
background: transparent; | background: transparent; | ||
+ | } | ||
+ | .scroll-down { | ||
+ | |||
+ | opacity: 1; | ||
+ | |||
+ | -webkit-transition: all .5s ease-in 3s; | ||
+ | |||
+ | transition: all .5s ease-in 3s; | ||
+ | |||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | .scroll-down { | ||
+ | |||
+ | position: absolute; | ||
+ | |||
+ | bottom: 20px; | ||
+ | |||
+ | left: 50%; | ||
+ | |||
+ | margin-left: -24px; | ||
+ | |||
+ | z-index: 2; | ||
+ | |||
+ | -webkit-animation: bounce 2s infinite 2s; | ||
+ | |||
+ | animation: bounce 2s infinite 2s; | ||
+ | |||
+ | -webkit-transition: all .2s ease-in; | ||
+ | |||
+ | transition: all .2s ease-in; | ||
+ | |||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | .scroll-down: before { | ||
+ | |||
+ | position: absolute; | ||
+ | |||
+ | top: calc(50% - 8px); | ||
+ | |||
+ | left: calc(50% - 6px); | ||
+ | |||
+ | transform: rotate(-45deg); | ||
+ | |||
+ | display: block; | ||
+ | |||
+ | width: 12px; | ||
+ | |||
+ | height: 12px; | ||
+ | |||
+ | content: ""; | ||
+ | |||
+ | border: 2px solid white; | ||
+ | |||
+ | border-width: 0px 0 2px 2px; | ||
+ | |||
+ | } | ||
+ | |||
+ | |||
+ | .scroll-down { | ||
+ | margin-top: -10px; | ||
+ | |||
+ | } | ||
+ | |||
+ | @keyframes bounce { | ||
+ | |||
+ | 0%, | ||
+ | |||
+ | 100%, | ||
+ | |||
+ | 20%, | ||
+ | |||
+ | 50%, | ||
+ | |||
+ | 80% { | ||
+ | |||
+ | -webkit-transform: translateY(0); | ||
+ | |||
+ | -ms-transform: translateY(0); | ||
+ | |||
+ | transform: translateY(0); | ||
+ | |||
+ | } | ||
+ | |||
+ | |||
+ | 40% { | ||
+ | |||
+ | -webkit-transform: translateY(-10px); | ||
+ | |||
+ | -ms-transform: translateY(-10px); | ||
+ | |||
+ | transform: translateY(-10px); | ||
+ | |||
+ | } | ||
+ | |||
+ | 60% { | ||
+ | |||
+ | -webkit-transform: translateY(-5px); | ||
+ | |||
+ | -ms-transform: translateY(-5px); | ||
+ | |||
+ | transform: translateY(-5px); | ||
+ | |||
+ | } | ||
+ | |||
} | } | ||
.under { | .under { |
Revision as of 09:01, 11 July 2018