| <div class="container"> | |
| <div class="follow"> | |
| <div class="icon first">@</div> | |
| <div class="icon">♪</div> | |
| <div class="icon">⊕</div> | |
| <div class="icon last">☎</div> | |
| <div class="label">Follow</div> | |
| </div> | |
| <div class="share"> |
My re-creation of the ending credits to the movie 10 Cloverfield Lane. https://www.youtube.com/watch?v=h30AsqS1U0E
I think it finally works in IE now! The scroll animation now works in IE - I had to avoid calc and also vh units. The :before and :after letters are hidden in IE - the "visible" of the pseudo-elements is not overriding the hidden of the parent like it should - I had to rely on color instead of visibility to hide some letters.
A Pen by Abbey McTaggart on CodePen.
Made this button hover effect using CSS animations and gradients. Hope you like it!
A Pen by Chris Colvin on CodePen.
| .centerMe | |
| .cta | |
| %span Notify me | |
| %form | |
| .input | |
| %input{'placeholder'=>'E-mail'} | |
| .button | |
| %button{'disabled'=>'disabled', 'type'=>'submit'} Send |