Aleksandr Sulyaev alexsul2008
alexsul2008
/ css.css
Created
August 18, 2016 10:00
Sign-Up/Login Form || http://codepen.io/alexsul/pen/jAJjzX
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| *, *:before, *:after { | |
| box-sizing: border-box; | |
| } | |
| html { | |
| overflow-y: scroll; | |
| } | |
| body { | |
| background: #c1bdba; |
alexsul2008
/ index.html
Created
August 18, 2016 09:02
Triangled || http://codepen.io/alexsul/pen/vKPqBK
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // html // | |
| <canvas id="canvas"></canvas> | |
| // CSS // | |
| canvas { | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; |
alexsul2008
/ Logo-Loader.html
Created
August 18, 2016 08:55
Logo Loader || http://codepen.io/alexsul/pen/akrAAA
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html> | |
| <body> | |
| <div id="background"></div> | |
| <div id="logocontainer" onclick=fill()> | |
| <div id="pelogo">Pe</div> | |
| <div class="loader" style="left:2vh; top:0; height:2vh; width:0; animation:slide1 1s linear forwards infinite"></div> | |
| <div class="loader" style="right:0; top:2vh; width:2vh; height:0; animation:slide2 1s linear forwards infinite; animation-delay:0.5s"></div> | |
| <div class="loader" style="right:2vh; bottom:0; height:2vh; width:0; animation:slide3 1s linear forwards infinite"></div> | |
| <div class="loader" style="left:0; bottom:2vh; width:2vh; height:0; animation:slide4 1s linear forwards infinite; animation-delay:0.5s"></div> | |
| </div> |
alexsul2008
/ index.html
Created
August 16, 2016 01:13
Image Hover || http://codepen.io/alexsul/pen/KrEPpv
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <figure class="snip1543"> | |
| <img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/331810/sample108.jpg" alt="sample108" /> | |
| <figcaption> | |
| <h3>Inverness McKenzie</h3> | |
| <p>The only skills I have the patience to learn are those that have no real application in life.</p> | |
| </figcaption> | |
| <a href="#"></a> | |
| </figure> | |
| <figure class="snip1543 hover"><img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/331810/sample100.jpg" alt="sample100" /> | |
| <figcaption> |
alexsul2008
/ index.html
Created
August 16, 2016 00:46
Эффект наведения на кнопку || http://codepen.io/alexsul/pen/xOrvmJ
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="button"><span>hover me</span> | |
| <div class="border o"></div> | |
| <div class="border tw"></div> | |
| <div class="border th"></div> | |
| <div class="border f"></div> | |
| </div> |
alexsul2008
/ index.html
Last active
August 16, 2016 00:20
News Cards - CSS only || http://codepen.io/alexsul/pen/pbGrOZ
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div class="row"> | |
| <div class="example-1 card"> | |
| <div class="wrapper"> | |
| <div class="date"> | |
| <span class="day">12</span> | |
| <span class="month">Aug</span> | |
| <span class="year">2016</span> | |
| </div> | |
| <div class="data"> | |
| <div class="content"> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!-- Google Map API --> | |
| <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=YOU-API-KEY&sensor=false"></script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| //Цели для Яндекс.Метрики и Google Analytics | |
| $(".count_element").on("click", (function() { | |
| ga("send", "event", "goal", "goal"); | |
| yaCounterXXXXXXXX.reachGoal("goal"); | |
| return true; | |
| })); |
alexsul2008
/ mousewheel-icon.html
Created
August 15, 2016 23:22
Mouse Wheel Animation CSS Icon | http://codepen.io/alexsul/pen/kXVOyB
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <style> | |
| /* ---------------------------------------------- /* | |
| * Mouse animate icon | |
| /* ---------------------------------------------- */ | |
| .mouse-icon { | |
| border: 2px solid #000; | |
| border-radius: 16px; | |
| height: 40px; | |
| width: 24px; | |
| display: block; |
alexsul2008
/ mobile-menu.html
Created
August 15, 2016 23:17
Mobile Menu Toggle Button | http://codepen.io/alexsul/pen/JKxgEp
NewerOlder