Asymmetry LP with animate.css & parallax.js
How do I make an asymmetry lp with animate.css & parallax.js?
Landing page with parallax background, inlined SVG icons, canvas painted illustrations with CSS animated appearance. No jQuery and whatsoever.. What is a asymmetry lp with animate.css & parallax.js? How do you make a asymmetry lp with animate.css & parallax.js? This script and codes were developed by Englishextra on 17 January 2023, Tuesday.
Asymmetry LP with animate.css & parallax.js Previews
Asymmetry LP with animate.css & parallax.js - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>asymmetry LP with animate.css & parallax.js</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="HandheldFriendly" content="True" /> <meta name="MobileOptimized" content="320" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <style> body,a{color:transparent;}body{background-color:#2B2B2B;}img,svg,canvas{display:none;} /* .wrapper{opacity:0;} */ .ripple { width: 16.000rem; height: 16.000rem; margin: 0; position: absolute; top: -3.333rem; left: 25%; } .ripple img { display: block; width: 16.000rem; height: 16.000rem; } </style> <script> var imagesPreloaded=false;(function(m){m="[object Array]"===Object.prototype.toString.apply(m)?m:[m];var t=function(){return imagesPreloaded=true;},f=function(){return imagesPreloaded=false;},c=[];for(var i=0,l=m.length;i<l;i++){c[i]=new Image();c[i].onabort=f;c[i].onerror=f;c[i].onload=t;c[i].src=m[i];}}(["https://englishextra.github.io/libs/john-locke/img/dots-8x8.png","https://englishextra.github.io/libs/john-locke/img/hand-200x96.png","https://englishextra.github.io/libs/john-locke/img/hero-960x1080.jpg","https://englishextra.github.io/libs/john-locke/img/john-locke-500x645.png","https://englishextra.github.io/libs/john-locke/img/matreshka-192x360.png","https://englishextra.github.io/libs/john-locke/img/monolith-960x1080.jpg","https://englishextra.github.io/libs/john-locke/img/notebook-320x462.png","https://englishextra.github.io/libs/john-locke/img/pen-96x1141.png","https://englishextra.github.io/libs/john-locke/img/ripple-200x200.svg","https://englishextra.github.io/libs/john-locke/img/start-360x360.svg"])); </script> </head> <body> <!-- images are hidden with display none in html and revealed with display block in css --> <!-- canvas and source image width and height should be of the same aspect ratio, not neccessarily size --> <!-- source svg for canvas painting should have width and height attributes --> <!-- images are finally scaled in css --> <!-- svg as image with svg-nosmil-img class if not supported is replaced with the data-fallback-src --> <!-- animated svg as image with svg-smil-img class if not supported is replaced with the data-fallback-src --> <svg style="position: absolute; width: 0; height: 0; overflow: hidden;" version="1.1" xmlns="http://www.w3.org/2000/svg"> <defs> <symbol id="logo" viewBox="0 0 108 108" enable-background="new 0 0 108 108"> <title>logo</title> <circle fill="#F03B4C" cx="54" cy="54" r="54"></circle><path fill="#191919" d="M64.5,79.1c-0.8,0-1.6-0.2-2.4-0.4c-3.5-1.2-5-3.9-4.2-7.5c0.6-2.9,1.7-5.4,2.7-8c0.8-1.8,1.5-3.4,2.3-5.3c0.5-1.2,1-2.5,1.5-3.8l0,0c-0.5,0.5-0.9,0.9-1.4,1.4c-1.2,1.2-2.4,2.5-3.6,3.8c-2,2.1-4,4.3-6.1,6.4c-1.5,1.5-3.3,3.2-5.6,4.2c-1.3,0.6-2.7,0.9-3.9,0.5c-2.3-0.6-3.5-2.4-3.3-5c0.2-2.1,0.8-4.2,1.8-6.4c0.9-1.9,1.8-3.9,2.7-5.9c0.5-0.9,0.9-2,1.4-2.9l1-2.4c1.2-2.7,2.5-5.5,3.8-8.3c0.3-0.8,0.6-1.7,0.8-2.5c0.1-0.3,0.1-0.6,0.3-0.9c-0.1,0.2-0.3,0.3-0.4,0.6c-1.6,2.3-3.1,4.5-4.8,6.8c-0.4,0.8-1,1.4-1.5,2.1c-1.2,1.6-2.5,3.4-3.8,5.3c-0.8,1-1.8,1.8-2.8,2.5c-1,0.6-2.3,0.8-3.3,0.3c-1.1-0.4-2-1.5-2.4-2.7c-0.6-1.9,0-3.9,0.8-5.3c0.6-1.3,1.3-2.6,2-3.9c0.6-1,1.2-2.3,1.8-3.3c0.6-1.2,1.2-2.4,1-3.8c0-0.8-0.4-1.5-1-2c-0.3-0.3-0.8-0.3-1.3,0c-1.4,0.6-2.3,1.7-3,2.7c-0.6,0.8-1.4,1-2.1,0.6c-0.4-0.3-0.8-0.8-0.9-1c-0.2-0.5,0-0.9,0.3-1.4c1.4-2.1,3-3.4,5-4.2c2.3-0.9,4.5,0,6,2.3c1,1.6,1.2,3.4,0.8,5.3c-0.6,1.6-1.2,3.3-2,4.8c-0.4,0.9-0.9,2-1.3,2.8c-0.4,0.9-0.9,2-1.3,2.9c-0.3,0.6-0.3,1.2-0.5,2v0.1c0,0,0,0.1,0.2,0.3c0.2,0,0.2-0.1,0.3-0.1c0.3-0.3,0.5-0.5,0.8-0.8c0.8-0.8,1.4-1.5,2-2.3c1-1.7,2.3-3.3,3.3-4.8c0.9-1.5,2-2.8,2.9-4.3c1.2-1.7,2.2-3.2,3.5-4.5c1.1-1.2,2.1-1.8,3.1-2.1c1-0.1,2,0.1,2.9,0.8c0.9,0.8,1.4,1.8,1.5,2.9c0.1,1.5,0,2.8-0.6,4.3l-0.3,0.9c-0.9,2.5-2,5.1-3,7.7c-0.9,2.1-2,4.2-2.9,6.4c-0.9,2.1-1.9,4.2-2.8,6.4c-0.4,1.2-0.9,2.6-1.2,3.8c-0.2,0.3-0.2,0.8-0.3,1.1c0,0.1,0,0.1,0,0.3c0.3-0.2,0.6-0.3,0.9-0.6c2.1-1.5,3.9-3.4,5.7-5.4c2.7-3,5.7-6.3,8.7-9.3c1-1.2,2.4-2.1,3.7-2.6c1.4-0.6,2.7-0.4,3.8,0.2c1.1,0.6,1.8,1.7,2.1,3s0,2.7-0.1,3.6c-0.6,2.4-1.5,4.8-2.4,6.9c-0.3,0.6-0.4,1.2-0.8,1.8c-1.2,3-2.1,5.4-3,7.7c-0.2,0.4-0.2,0.9-0.3,1.3c0,0.3-0.1,0.5-0.1,0.8h0.1c0.5,0,1.1,0,1.4-0.1c1.6-0.6,3-2,4.3-3.2c0.9-0.9,1.8-1.8,2.7-2.6l0.2-0.1c0.9-0.9,1.8-0.9,2.8,0c0.8,0.6,1.4,1.2,2,1.8c0.4,0.4,0.6,0.9,0.6,1.3S78.5,71,78,71.3l-0.3,0.3c-2.4,2.4-4.8,4.8-7.9,6.5C67.5,78.6,66,79.1,64.5,79.1z"></path> </symbol> </defs> <defs> <symbol id="arrow" viewBox="0 0 120 72" enable-background="new 0 0 120 72"> <title>arrow</title> <path fill="#F03B4C" d="M12.4,0.9c-0.1,0.2-0.1,0.3-0.2,0.5c-0.4-0.9-2-1-2.5,0.2C9.6,1.9,9.5,2.2,9.4,2.4C8.6,2.6,8.1,3.7,8.7,4.5C7,9,5.4,13.5,3.7,18c-0.6,1.5-1.3,3-1.9,4.6c-0.1,0.2-0.1,0.5,0,0.7c-0.6,1.5-1.1,3.1-1.7,4.6c-0.4,1,0.5,1.6,1.3,1.6c0,0.2,0,0.3-0.1,0.5c0,0,0,0,0,0l0,0c0,0.1,0,0.2,0,0.3c-0.1,0.5,0.2,0.9,0.5,1.1c0,0,0,0.1,0,0.1c-0.5,1.7,2,2.3,2.6,0.7c1.2-3.3,2.3-6.6,3.5-9.9c0.3-0.3,0.4-0.4,0.8-1.4c0.1-0.3,0.1-0.6-0.1-0.8c0.7-2,1.4-4,2.1-6.1C15,32.2,28.3,47.5,44.9,56.4c4.3,2.3,8.8,4.2,13.4,5.6c18.3,9.6,41.4,14.2,60.3,4.9c0.7-0.3,0.2-1.5-0.5-1.2c-3.3,1.4-6.6,2.4-10,3c4-1.3,7.9-3.3,11.6-6.2c0.9-0.7,0.1-1.8-0.7-2c0.7-0.9-0.3-2.4-1.5-1.7c-2.4,1.4-4.9,2.5-7.5,3.4c-10.7,1.7-21.7,2.3-32.4,1.2c-2.2-0.4-4.4-0.9-6.6-1.5C65.6,60,60.7,57.5,56,54.7c-9.4-5.7-18.5-12.4-26.1-20.2c-1.2-1.2-2.3-2.5-3.4-3.8c-3-4.4-5.7-9-7.9-13.9c3.1,2.9,6.3,5.6,9.7,8.1c0.7,0.5,1.6,0,1.9-0.7c1.1,0.4,2.1-1.3,1.3-2.3c-0.9-1-1.7-2-2.6-3.1c0.5-0.5,0.7-1.2,0.1-1.9c-1-1-2-2-3.1-2.9c-4.2-4.1-7.9-8.6-11.2-13.6C14.2-0.3,12.8-0.1,12.4,0.9z M93.1,68.5c6.8,0,13.5-1.4,19.8-4.4c0.1,0,0.2,0,0.4-0.1C107,67.6,100.2,68.8,93.1,68.5z M13.9,4.7C13.9,4.6,14,4.4,14,4.2c0.3,0.4,0.6,0.8,0.9,1.3C14.6,5.2,14.2,5,13.9,4.7z M51.7,54.8c-1-0.5-2.1-1-3.1-1.6c-1.8-1.3-3.5-2.7-5.2-4.1C46.1,51.2,48.9,53,51.7,54.8z M33.4,45.6c-9.7-8.2-17.1-19-20.2-31.2c0.3,0.5,0.6,1.1,0.9,1.6C17.3,27.6,24.3,37.7,33.4,45.6z M24.4,31.9c1.3,1.9,2.6,3.7,4,5.4c-2-2.3-3.8-4.7-5.4-7.2C23.5,30.7,23.9,31.3,24.4,31.9z"></path> </symbol> </defs> <defs> <symbol id="phone" viewBox="0 0 256 512" enable-background="new 0 0 256 512"> <title>phone</title> <path fill="#393939" d="M209.5,512c0,0,46.5,0,46.5-46.5V46.5C256,0,209.5,0,209.5,0H46.5C46.5,0,0,0,0,46.5v418.9C0,512,46.5,512,46.5,512H209.5z M128,492.6c-12.8,0-23.3-10.4-23.3-23.2c0-12.8,10.4-23.2,23.3-23.2c12.8,0,23.3,10.4,23.3,23.2S140.8,492.6,128,492.6z M93.1,28.4c0-2.9,1.4-5.1,3.1-5.1h63.6c1.7,0,3.1,2.3,3.1,5.1v1.4c0,2.9-1.4,5.1-3.1,5.1H96.2c-1.7,0-3.1-2.3-3.1-5.1C93.1,29.7,93.1,28.4,93.1,28.4z M23.3,58.1h209.5v371.8H23.3V58.1z"></path> </symbol> </defs> <defs> <symbol id="signature" viewBox="0 0 600 244" enable-background="new 0 0 600 244"> <title>signature</title> <path fill="#E6E6E6" d="M102.2,170.8c-9.8-28.8-7.7-62.3,4.7-89.9c10.2-22.6,31.5-43.7,50.5-59.4c13.3-11,27.6-16,44.7-14.6c0.7-2.3,1.4-4.6,2.1-6.8c-10.8,0.7-20.1,14.6-25.5,22.1c-33.3,46.2-46.1,102.7-72.9,152.2c-12.7,23.4-54.6,82.8-88.7,57.3c-15.9-11.8-3.3-34.3,8.3-43.7c25.1-20.1,59.9-28.6,87.5-45.1c5.5-3.3-2.4-6.5-6.3-4.2c-29,17.3-63.9,26.3-90.4,47.4c-11.8,9.6-21.1,27.8-13.4,42.6c13.9,26.9,51.3,12.7,69.3-0.6c52.7-38.7,66.4-113,94.2-168.2c8.1-16.1,17.1-32.5,29.2-45.9c2.1-2.3,4.7-4.9,7.4-6.5c1.8-1,1.7-0.6,0.5-0.5c4.1-0.2,8.1-6.4,2.1-6.8c-42.9-3.3-72,30.5-96.5,61.4c-23.9,30.1-28.5,75.9-16.4,111.8C94.1,177.6,103.6,175,102.2,170.8L102.2,170.8 M179.8,160c1.5-13.8,7.3-54.7,26.2-54.3c15.3,0.3,5.4,23.7,2,30.2c-4.3,8.1-17.9,28.7-29.2,22.2c-3-1.7-11.7,2.5-7.5,4.9c14.2,8.1,30.3-5.3,38.6-16c7.5-9.6,22.1-32.6,9.6-43.7c-12.9-11.4-30.4,2.9-36.7,13.9c-7.5,13-10.9,29.1-12.5,43.8C169.7,165.3,179.4,163.6,179.8,160 M292.7,80.2c9.9-8.1,19.2-18.3,23.2-30.6c4.8-14.9-9.8-22.4-22.1-18.9c-18.7,5.4-32.3,27.5-41.1,43.1c-6.9,12.3-11.3,26.2-15.2,39.7c-2.1,7.4-3.1,24.4-10.3,29c2.5,0.6,5,1.3,7.5,1.9c3.8-7.1,8.2-13.9,13-20.4c1-1.3,13.7-14.7,12.8-11c-0.8,3.5-3.1,7-4.7,10.2c-6.8,14-0.5,18.8,13.9,15.4c5.9-1.4,4.4-6.7-1.4-5.3c-16.8,4,14.2-28.4-4.1-28.2c-17.9,0.2-31.3,25.5-38.5,38.9c-2.3,4.3,5.8,3,7.5,1.9c7.2-4.7,8.7-13.8,10.7-21.5c5.3-20.6,11.7-40.4,22.8-58.7c5.4-8.9,12.2-16.9,19.9-23.9c13.9-12.7,23.7,0.5,17.7,13.9c-4,8.9-12,16.6-19.5,22.7C280.6,81.7,290.1,82.3,292.7,80.2L292.7,80.2 M285.2,111.8c1.7-1.3,6.9-4.5,8-4.6c1.3-0.1,0,6-0.2,6.8c-2.7,9.6-8.5,18.5-13.6,26.9c3.1-0.2,6.1-0.5,9.2-0.7c3-5.9,6.3-11.7,9.8-17.3c2.7-4.3,5.5-8.4,8.7-12.2c1.4-1.7,2.9-3.2,4.6-4.6c1.3-0.7,1-0.8-0.8-0.1c0.8,0.5,1.2,1.4,1.5,2.3c1.7,5.1-8.5,13.4-10.7,17.8c-4.8,9.5,11.3,12.2,17,13.2c2.7,0.5,11.2-3.9,6-4.8c-4.4-0.8-15.8-1.9-13.8-8.9c1.2-4.1,5.4-7.6,7.9-10.9c4.4-5.8,4.2-14.9-5.4-13.6c-9.9,1.3-16.2,10.6-21.4,18.2c-4.9,7.1-9.2,14.7-13,22.4c-1.3,2.5,7.9,1.5,9.2-0.7c2.5-4.1,24.9-36.8,10.3-38.4c-7.4-0.8-15.2,4.1-21,8.3C273.4,113.7,283,113.4,285.2,111.8L285.2,111.8 M393.6,84.2c15.2,1,31.7-1.8,45.8-7.4c21.4-8.5,51-29,53.3-54.3c1.6-17.2-26-0.7-30,3c-11.2,10.3-18.4,22.6-24.4,36.4c-8.7,19.8-20,38.6-33.1,55.8c-8.5,11.2-26.4,34.7-42.7,26.8c-0.7-3.6,0.8-4.4,4.5-2.4c4.9,1.4,7.9,6.8,9.9,11c1.7,3.6,2.4,7.4,4.3,10.9c8.2,15.2,26,25.8,41.2,32.8c16.3,7.5,35,10.4,52.1,4c20.7-7.8,26.8-31.6,28-51.3c0.3-4.8-9.4-3.3-9.7,0.8c-1.6,25.1-11.3,49.3-40.3,47.2c-19.6-1.5-39.3-12.9-53.3-26.2c-11.6-11.1-12.1-31.4-28.9-36.2c-6.8-1.9-25.9,3.1-17.5,12.8c11.3,13.1,33.3-0.2,42.5-8.5c24.1-21.9,41.1-51.7,54.1-81.2c6.1-13.9,15.4-28.1,29.1-35.6c7.7-4.2,3.1,6.5,1.7,9.5c-4.7,10.2-12.9,19-21.4,26.1c-16.2,13.5-40.7,20.6-61.8,19.1C392.5,77.2,387.1,83.7,393.6,84.2L393.6,84.2 M435.5,140.1c1.6-6.7,13.4-46.3,22.2-39.7c6.7,5.1,1.6,18.8-1,24.7c-3.6,8.4-11.6,21.7-21.5,14c-2.3-1.8-11,1.9-9,3.5c11.1,8.6,25.1,2.1,33.1-7.5c6.5-7.8,16.3-26.9,8.6-36.7c-8.5-10.9-23.6,1.1-28.7,9.1c-6.5,10.2-10.4,22.4-13.2,34.1C425.3,144.4,434.8,142.9,435.5,140.1 M507.4,104.3c0.1-5,0.3-14.1-4.4-17.3c-10.2-6.9-19.1,9.9-23.4,16.2c-5.1,7.5-13.5,17.2-12.3,26.9c1.4,11,21.2,9,28.2,8.4c5.3-0.4,7.4-7.4,0.9-6.9c-4.3,0.3-19.4,2.6-19.6-4.9c-0.1-6.1,5.3-12.7,8.5-17.5c2.2-3.3,4.5-6.6,6.8-9.9c1.6-2.3,3.2-4.8,5.3-6.7c-2-0.8-2.5-0.7-1.6,0.3c0.3,0.5,0.5,1,0.6,1.5c1.2,3.3,1.3,7.2,1.2,10.7C497.7,110,507.4,108.5,507.4,104.3L507.4,104.3 M569.1,75.8c9.5-7.5,21.7-17.6,24.8-29.8c2.8-11-14.6-11.5-20.8-9c-19.4,7.9-30.9,29.8-40.3,47c-6.1,11.1-11.5,22.7-16.5,34.3c-1.3,2.9-4.3,15.2-7.8,16.1c-5.8,1.4-4.5,6.1,1.3,4.6c5.4-1.3,8.6-4.3,10.8-9.3c7.7-17.2,15-34.4,24-51c5.8-10.7,12.6-21,21-29.8c3.8-4,19-14.3,18.7-1.6c-0.2,10.2-15.5,21.2-22.9,27.1C557.2,77.7,566.8,77.7,569.1,75.8L569.1,75.8 M540.4,89.5c3.5-3.2,8.3-2.5,5.9,3.3c-2.1,5-7.5,9.4-11.5,12.8c-4.8,4.1-10.1,7.7-15.5,11c-1.7,1-2.5,3.5-0.6,4.7c20.9,13.3,47.2,9.8,65.3-6.2c4.9-4.3,17.6-17.2,12.4-25.1c-3.8-5.9-12.6-4.8-18.2-2.7c-19.8,7.4-31.6,36.8-12.6,51.7c9.2,7.2,40.8,1.7,33.3-14.3c-1.9-4-11.3-1.2-9.6,2.6c2.1,4.6-1.6,7-5.7,8.2c-7.6,2.2-13.6-3.1-16.3-9.7c-5.2-12.9,2-29.4,15.5-33.2c7-2,4.3,5.7,2.6,8.9c-6.1,11.4-18.8,19.5-31.4,21.2c-9.3,1.2-20.1-1.8-27.9-6.8c-0.2,1.6-0.4,3.1-0.6,4.7c11.6-7.1,28.3-17.6,31.4-31.8c3.8-17.2-19.3-6.7-24.5-2C528.1,90.9,537.4,92.2,540.4,89.5L540.4,89.5z"></path> </symbol> </defs> <defs> <symbol id="swipeup" viewBox="0 0 120 120" enable-background="new 0 0 120 120"> <title>swipeup</title> <path fill="#DDF03B" d="M17.351,30.487c-1.732-3.02-3.35-6.171-4.843-9.45c-0.436-0.959-1.52-1.328-2.434-0.788c-3.111,1.843-6.187,3.85-9.213,6.02c-0.648,0.466-0.933,0.983-0.846,1.828c0.089,0.846,0.699,1.153,1.409,1.32c1.761,0.41,3.522,0.819,5.283,1.23c-5.056,22.236-4.31,45.479,2.24,67.417c0.388,1.309,1.951,2.229,3.095,1.848c1.143-0.383,1.886-2.007,1.515-3.258C7.254,75.533,6.534,53.153,11.403,31.74c1.369,0.319,2.738,0.638,4.107,0.957c0.713,0.166,1.384,0.174,1.816-0.439C17.756,31.645,17.722,31.135,17.351,30.487z"></path><path fill="#DDF03B" d="M111.67,46.175c-5.78-6.181-32.83-16.193-33.979-16.616c-0.695-0.256-1.43-0.385-2.182-0.385c-3.112,0-6.174,2.234-7.281,5.311c-0.167,0.466-0.432,1.708-0.496,3.061c-0.742-0.211-1.506-0.318-2.276-0.318c-3.531,0-6.715,2.258-7.923,5.617c-0.665,1.848-0.682,3.827-0.063,5.662c-3.498-0.119-6.491,1.869-7.665,5.136c-0.771,2.14-0.646,4.421,0.348,6.425l-21.296-6.983c-1.139-0.419-2.304-0.633-3.462-0.633c-3.653,0-6.686,2.118-7.913,5.529c-1.643,4.574,0.766,9.369,5.642,11.165l36.528,12.57c0.166,1.108,0.57,2.848,1.536,5.239c2.563,6.336,11.746,12.891,22.674,12.891c2.167,0,4.329-0.261,6.428-0.774C104.74,95.54,113,88.208,117.911,74.552C123.113,60.083,117.68,52.6,111.67,46.175z M114.515,73.3c-4.505,12.528-11.769,18.965-25.075,22.216c-1.822,0.445-3.699,0.672-5.58,0.672c-9.286,0-17.265-5.512-19.33-10.62c-0.389-0.962-0.67-1.786-0.87-2.471l11.93,4.104c0.946,0.323,1.971-0.187,2.291-1.144c0.32-0.957-0.183-1.995-1.13-2.32L24.32,65.694c-2.998-1.103-4.414-3.762-3.444-6.463c0.947-2.632,3.678-3.834,6.805-2.689l32.103,10.53c0.877,0.288,1.837-0.144,2.21-1.002c0.373-0.86,0.043-1.864-0.762-2.329l-4.782-2.746c-0.088-0.05-0.179-0.093-0.275-0.127c-1.247-0.458-2.238-1.323-2.792-2.433c-0.546-1.096-0.612-2.353-0.185-3.54c0.626-1.739,2.07-2.736,3.964-2.736c0.662,0,1.339,0.126,2.014,0.374l3.387,1.247c0.002,0.001,0.006,0.001,0.008,0.002c0.938,0.346,1.974-0.144,2.315-1.094c0.341-0.949-0.142-1.998-1.079-2.343c-1.209-0.445-2.174-1.341-2.718-2.521c-0.543-1.181-0.601-2.505-0.161-3.728c0.69-1.92,2.51-3.211,4.529-3.211c0.56,0,1.114,0.1,1.648,0.296l7.356,2.71c0.933,0.344,1.974-0.143,2.315-1.092s-0.142-1.999-1.079-2.344l-4.322-1.592c-0.084-0.808-0.039-2.319,0.251-3.127c0.708-1.965,3.103-3.376,4.832-2.738c7.601,2.8,28.275,11.078,32.592,15.694C114.704,54.74,119.021,60.766,114.515,73.3z"></path> </symbol> </defs> <defs> <symbol id="mousewheeldown" viewBox="0 0 120 120" enable-background="new 0 0 120 120"> <title>mousewheeldown</title> <path fill="#DDF03B" d="M71.122,7.6c10.592,0,19.331,8.667,19.331,19.467v54.667C90.453,98.667,76.815,112.4,60,112.4S29.547,98.667,29.547,81.733V27.067C29.547,16.4,38.153,7.6,48.878,7.6H71.122 M71.122,0H48.878C34.049,0,22,12.133,22,27.067v54.667C22,102.8,38.948,120,60,120l0,0c21.052,0,38-17.2,38-38.267V27.067C98,12.133,85.951,0,71.122,0L71.122,0z"></path><path fill="#DDF03B" d="M60,62.5c-0.3,0-0.7-0.1-1-0.3L50.2,56c-0.8-0.5-1-1.6-0.4-2.4c0.5-0.8,1.6-1,2.4-0.4l7.8,5.5l7.8-5.5c0.8-0.5,1.8-0.4,2.4,0.4c0.5,0.8,0.4,1.8-0.4,2.4L61,62.2C60.7,62.4,60.3,62.5,60,62.5z"></path><path fill="#DDF03B" d="M60.1,75.8c-0.3,0-0.7-0.1-1-0.3l-8.8-6.2c-0.8-0.5-1-1.6-0.4-2.4c0.5-0.8,1.6-1,2.4-0.4l7.8,5.5l7.8-5.5c0.8-0.5,1.8-0.4,2.4,0.4c0.5,0.8,0.4,1.8-0.4,2.4l-8.8,6.2C60.8,75.7,60.5,75.8,60.1,75.8z"></path><path fill="#DDF03B" d="M60,88.8c-0.3,0-0.7-0.1-1-0.3l-8.8-6.2c-0.8-0.5-1-1.6-0.4-2.4c0.6-0.8,1.6-1,2.4-0.4L60,85l7.8-5.5c0.8-0.5,1.8-0.4,2.4,0.4c0.5,0.8,0.4,1.8-0.4,2.4L61,88.5C60.7,88.7,60.3,88.8,60,88.8z"></path><path fill="#DDF03B" d="M60,46.3c-1.9,0-3.4-1.5-3.4-3.4v-7.5c0-1.9,1.5-3.4,3.4-3.4s3.4,1.5,3.4,3.4v7.5C63.4,44.8,61.9,46.3,60,46.3z"></path> </symbol> </defs> <defs> <symbol id="btn-share" viewBox="0 0 96 96" enable-background="new 0 0 96 96"> <title>btn-share</title> <path fill="#767676" d="M75.406,57.594c0.708,0.458,1.349,0.995,1.922,1.61c0.573,0.615,1.057,1.286,1.453,2.015c0.396,0.729,0.698,1.5,0.906,2.313S80,65.167,80,66c0,1.375-0.266,2.667-0.797,3.875c-0.531,1.209-1.25,2.266-2.156,3.172c-0.906,0.906-1.964,1.625-3.172,2.156C72.667,75.734,71.375,76,70,76c-1.917,0-3.687-0.51-5.313-1.531c-2.396,1.812-5.026,3.188-7.891,4.125C53.932,79.531,51,80,48,80s-5.932-0.469-8.797-1.406c-2.865-0.938-5.495-2.313-7.891-4.125C29.687,75.49,27.917,76,26,76c-1.375,0-2.667-0.266-3.875-0.797c-1.209-0.531-2.266-1.25-3.172-2.156c-0.906-0.906-1.625-1.964-2.156-3.172S16,67.375,16,66c0-0.834,0.104-1.656,0.313-2.469c0.209-0.813,0.51-1.583,0.906-2.313c0.396-0.729,0.88-1.401,1.453-2.015c0.573-0.614,1.213-1.151,1.922-1.61c-0.209-0.938-0.359-1.87-0.453-2.797S20,52.938,20,52c0-2.875,0.433-5.661,1.297-8.359c0.865-2.698,2.083-5.198,3.656-7.5c1.573-2.302,3.463-4.339,5.672-6.109s4.667-3.167,7.375-4.188c0.021-1.354,0.297-2.63,0.828-3.828c0.531-1.198,1.25-2.239,2.156-3.125c0.906-0.885,1.964-1.589,3.172-2.109C45.364,16.26,46.646,16,48,16s2.635,0.26,3.844,0.781c1.209,0.521,2.266,1.224,3.172,2.109c0.906,0.885,1.625,1.927,2.156,3.125c0.531,1.198,0.807,2.474,0.828,3.828c2.708,1.021,5.167,2.417,7.375,4.188c2.208,1.771,4.099,3.807,5.672,6.109s2.791,4.802,3.656,7.5C75.567,46.339,76,49.125,76,52c0,0.938-0.047,1.87-0.141,2.797C75.765,55.724,75.614,56.656,75.406,57.594z M48,20c-0.834,0-1.614,0.156-2.344,0.469c-0.73,0.313-1.365,0.74-1.906,1.281s-0.969,1.177-1.281,1.906C42.156,24.385,42,25.166,42,26s0.156,1.614,0.469,2.344c0.313,0.73,0.74,1.365,1.281,1.906c0.541,0.541,1.177,0.969,1.906,1.281C46.385,31.844,47.167,32,48,32s1.614-0.156,2.344-0.469c0.729-0.313,1.365-0.74,1.906-1.281s0.969-1.177,1.281-1.906C53.844,27.615,54,26.834,54,26s-0.156-1.614-0.469-2.344c-0.313-0.73-0.74-1.365-1.281-1.906c-0.541-0.541-1.177-0.969-1.906-1.281C49.614,20.156,48.833,20,48,20z M20,66c0,0.834,0.156,1.614,0.469,2.344c0.313,0.73,0.74,1.365,1.281,1.906s1.177,0.969,1.906,1.281S25.167,72,26,72s1.614-0.156,2.344-0.469c0.73-0.313,1.365-0.74,1.906-1.281c0.541-0.541,0.969-1.177,1.281-1.906C31.844,67.615,32,66.834,32,66s-0.156-1.614-0.469-2.344c-0.313-0.73-0.74-1.365-1.281-1.906s-1.177-0.969-1.906-1.281C27.615,60.156,26.834,60,26,60s-1.614,0.156-2.344,0.469c-0.73,0.313-1.365,0.74-1.906,1.281c-0.541,0.541-0.969,1.177-1.281,1.906C20.156,64.385,20,65.167,20,66z M48,76c2.458,0,4.859-0.37,7.203-1.109c2.344-0.74,4.526-1.818,6.547-3.234c-0.563-0.834-0.995-1.734-1.297-2.703c-0.302-0.969-0.453-1.953-0.453-2.953c0-1.375,0.266-2.667,0.797-3.875c0.531-1.209,1.25-2.266,2.156-3.172s1.964-1.625,3.172-2.156C67.332,56.266,68.625,56,70,56c0.271,0,0.542,0.011,0.812,0.031c0.27,0.021,0.542,0.052,0.812,0.094C71.875,54.75,72,53.375,72,52c0-2.437-0.349-4.787-1.047-7.047c-0.698-2.26-1.687-4.354-2.969-6.281c-1.281-1.927-2.834-3.646-4.656-5.156c-1.822-1.51-3.859-2.734-6.109-3.672c-0.375,0.917-0.88,1.755-1.516,2.516c-0.636,0.761-1.359,1.411-2.172,1.953c-0.812,0.542-1.687,0.958-2.625,1.25C49.969,35.854,49,36,48,36s-1.969-0.146-2.906-0.437c-0.938-0.292-1.812-0.708-2.625-1.25c-0.813-0.542-1.537-1.193-2.172-1.953c-0.635-0.761-1.141-1.599-1.516-2.516c-2.25,0.938-4.286,2.162-6.109,3.672c-1.823,1.51-3.375,3.229-4.656,5.156c-1.281,1.927-2.271,4.021-2.969,6.281C24.35,47.213,24,49.563,24,52c0,1.375,0.125,2.75,0.375,4.125c1.5-0.25,2.953-0.167,4.359,0.25c1.406,0.417,2.646,1.089,3.719,2.015c1.073,0.927,1.932,2.047,2.578,3.359C35.677,63.062,36,64.479,36,66c0,1-0.151,1.985-0.453,2.953c-0.302,0.969-0.734,1.87-1.297,2.703c2.021,1.417,4.203,2.495,6.547,3.234S45.542,76,48,76z M70,72c0.834,0,1.614-0.156,2.344-0.469c0.73-0.313,1.365-0.74,1.906-1.281c0.541-0.541,0.969-1.177,1.281-1.906S76,66.834,76,66c0-0.834-0.156-1.614-0.469-2.344s-0.74-1.365-1.281-1.906s-1.177-0.969-1.906-1.281C71.615,60.156,70.834,60,70,60s-1.614,0.156-2.344,0.469c-0.73,0.313-1.365,0.74-1.906,1.281s-0.969,1.177-1.281,1.906S64,65.167,64,66s0.156,1.614,0.469,2.344c0.313,0.73,0.74,1.365,1.281,1.906c0.541,0.541,1.177,0.969,1.906,1.281S69.167,72,70,72z"></path> </symbol> </defs> <defs> <symbol id="btn-like" viewBox="0 0 96 96" enable-background="new 0 0 96 96"> <title>btn-like</title> <rect fill="none" width="96" height="96"></rect><path fill="#767676" d="M74,40c0.812,0,1.583,0.156,2.313,0.469s1.37,0.74,1.922,1.281c0.553,0.541,0.985,1.177,1.297,1.906C79.844,44.385,80,45.167,80,46c0,0.667-0.104,1.302-0.313,1.906l-8,24c-0.209,0.604-0.5,1.162-0.875,1.672c-0.375,0.51-0.812,0.943-1.313,1.297c-0.5,0.354-1.047,0.63-1.641,0.828C67.266,75.901,66.646,76,66,76H50c-3.729,0-7.323-0.719-10.781-2.156c-1.5-0.604-3.005-1.062-4.516-1.375C33.193,72.156,31.625,72,30,72H16V44h13.031c1.354,0,2.63-0.25,3.828-0.75c1.198-0.5,2.276-1.229,3.234-2.188l19.437-19.406c0.521-0.521,1.042-0.927,1.563-1.219C57.615,20.146,58.25,20,59,20c0.687,0,1.333,0.13,1.938,0.39c0.604,0.26,1.135,0.62,1.594,1.078c0.458,0.458,0.818,0.989,1.078,1.594C63.869,23.666,64,24.312,64,25c0,1.687-0.188,3.297-0.563,4.828c-0.375,1.531-0.927,3.047-1.656,4.547c-0.417,0.896-0.771,1.807-1.062,2.734C60.427,38.036,60.229,39,60.125,40H74z M66,72c0.417,0,0.802-0.125,1.156-0.375c0.354-0.25,0.604-0.583,0.75-1c0.104-0.292,0.297-0.854,0.578-1.687s0.62-1.838,1.015-3.015c0.396-1.177,0.834-2.469,1.313-3.875s0.958-2.828,1.437-4.266c0.479-1.437,0.943-2.838,1.39-4.203c0.447-1.365,0.849-2.594,1.203-3.687c0.354-1.094,0.635-1.989,0.844-2.687c0.209-0.698,0.313-1.099,0.313-1.203c0-0.542-0.198-1.011-0.594-1.406C75.01,44.198,74.541,44,73.999,44H56c0-1.104,0.026-2.13,0.078-3.078c0.052-0.948,0.156-1.87,0.313-2.766c0.156-0.896,0.38-1.791,0.672-2.687c0.292-0.896,0.677-1.844,1.156-2.844c0.583-1.209,1.026-2.443,1.328-3.703C59.849,27.662,60,26.355,60,25c0-0.292-0.094-0.531-0.281-0.719C59.532,24.093,59.292,24,59,24c-0.125,0-0.234,0.047-0.328,0.141l-0.266,0.266l-19.469,19.5c-0.667,0.667-1.38,1.25-2.141,1.75s-1.567,0.927-2.422,1.281C32.708,47.646,30.927,48,29.031,48H20v20h10c3.708,0,7.302,0.719,10.781,2.156C43.781,71.385,46.854,72,50,72H66z"></path> </symbol> </defs> </svg> <div id="container" class="wrapper"> <div class="hero animated duration-3s bounceInLeft"></div> <div class="monolith animated duration-3s bounceInRight"></div> <div id="scene" class="scene" data-friction-x="0.1" data-friction-y="0.1" data-scalar-x="25" data-scalar-y="15"> <div class="layer" data-depth="0.40"> <!-- <img src="https://englishextra.github.io/libs/john-locke/img/matreshka-192x360.png" class="matreshka animated duration-3s bounceInUp" alt="" /> --> <canvas data-src="https://englishextra.github.io/libs/john-locke/img/matreshka-192x360.png" width="192" height="360" class="matreshka animated duration-3s bounceInUp"></canvas> </div> <div class="layer" data-depth="0.60"> <!-- <img src="https://englishextra.github.io/libs/john-locke/img/notebook-320x462.png" class="notebook animated duration-3s bounceInUp" alt="" /> --> <canvas data-src="https://englishextra.github.io/libs/john-locke/img/notebook-320x462.png" width="320" height="462" class="notebook animated duration-3s bounceInUp"></canvas> </div> <div class="layer" data-depth="0.80"> <!-- <img src="https://englishextra.github.io/libs/john-locke/img/pen-96x1141.png" class="pen animated duration-3s bounceInDown" alt="" /> --> <canvas data-src="https://englishextra.github.io/libs/john-locke/img/pen-96x1141.png" width="96" height="1141" class="pen animated duration-3s bounceInDown"></canvas> </div> </div> <!-- <div class="john-locke animated duration-3s bounceIn"> <img src="https://englishextra.github.io/libs/john-locke/img/john-locke-500x645.png" class="animated duration-5s swing" alt="" /> </div> --> <div class="john-locke animated duration-3s bounceIn"> <canvas data-src="https://englishextra.github.io/libs/john-locke/img/john-locke-500x645.png" width="500" height="645" class="animated duration-5s swing"></canvas> </div> <!-- <div class="signature animated duration-3s bounceInLeft"> <img src="https://englishextra.github.io/libs/john-locke/img/signature-600x244.png" class="" alt="animated duration-5s swing" /> </div> --> <div class="signature animated duration-3s bounceInLeft"> <svg class="animated duration-5s swing"><use xlink:href="#signature"></use></svg> </div> <div class="intro animated duration-5s bounceInLeft" role="navigation" aria-label="Site"> <h1> <a href="#" rel="contents" title="Содержание - Английский без регистрации">статьи<br/>по грамматике<br/>английского<br/><span>для русскоговорящих</span></a> </h1> </div> <div class="quote animated bounceInDown"> <p>«Великое искусство научиться многому —<br/>это браться сразу за немногое.» (Джон Локк)</p> </div> <div class="start animated"> <a href="#" rel="contents" title="Содержание - Английский без регистрации"> <img src="https://englishextra.github.io/libs/john-locke/img/start-360x360.svg" data-fallback-src="https://englishextra.github.io/libs/john-locke/img/start-360x360.png" class="svg-smil-img animated duration-5s swing" alt="" /> </a> </div> <div class="hand animated"> <a href="#" rel="contents" title="Содержание - Английский без регистрации"> <!-- <img src="https://englishextra.github.io/libs/john-locke/img/hand-200x96.png" class="animated duration-5s swing" alt="" /> --> <canvas data-src="https://englishextra.github.io/libs/john-locke/img/hand-200x96.png" width="200" height="96" class="animated duration-5s swing"></canvas> </a> </div> <div class="guesture animated"> <svg class="swipeup animated duration-5s swing"><use xlink:href="#swipeup"></use></svg> <svg class="mousewheeldown animated duration-5s swing"><use xlink:href="#mousewheeldown"></use></svg> </div> <div class="footer animated duration-3s bounceInDown"> <p> <a href="https://github.com/englishextra/englishextra.github.io/tree/master/libs/john-locke" target="_blank" rel="noopener">© englishextra, 2006—2017</a> </p> </div> <!-- <div class="btn-vk animated duration-3s bounceInUp"> <a href="https://vk.com/englishextragithubio" target="_blank" rel="noopener" title="Группа в ВК - Английский без регистрации"><img src="https://englishextra.github.io/libs/john-locke/img/btn-vk-96x96.svg" data-fallback-src="https://englishextra.github.io/libs/john-locke/img/btn-vk-96x96.png" class="svg-nosmil-img animated pulse" alt="" /></a> </div> <div class="btn-tutor animated duration-3s bounceInUp"> <a href="https://englishextra.github.io/serguei/" target="_blank" rel="noopener" title="Репетитор английского в Тушино"><img src="https://englishextra.github.io/libs/john-locke/img/btn-tutor-96x96.svg" data-fallback-src="https://englishextra.github.io/libs/john-locke/img/btn-tutor-96x96.png" class="svg-nosmil-img animated pulse" alt="" /></a> </div> --> <!-- <div class="phone animated duration-3s bounceInDown"> <img src="https://englishextra.github.io/libs/john-locke/img/phone-256x512.png" class="animated duration-5s swing" alt="" /> </div> --> <div class="phone animated duration-3s bounceInDown"> <svg class="animated duration-5s swing"><use xlink:href="#phone"></use></svg> </div> <!-- <div class="arrow animated duration-3s bounceInDown"> <img src="https://englishextra.github.io/libs/john-locke/img/arrow-120x72.png" class="animated duration-5s swing" alt="" /> </div> --> <div class="arrow animated duration-3s bounceInDown"> <svg class="animated duration-5s swing"><use xlink:href="#arrow"></use></svg> </div> <div class="btn-share animated bounceInDown"> <a href="javascript:void(0);" title="Поделиться"><svg class="animated duration-5s swing"><use xlink:href="#btn-share"></use></svg></a> </div> <div class="btn-like animated bounceInDown"> <a href="javascript:void(0);" title="Нравиться"><svg class="animated duration-5s swing"><use xlink:href="#btn-like"></use></svg></a> </div> <!-- <div class="logo animated duration-3s bounceInLeft"> <a href="https://englishextra.github.io/app/#/contents" rel="contents" title="Апп - Английский без регистрации"><img src="https://englishextra.github.io/libs/john-locke/img/logo-108x108.png" class="animated infinite pulse" alt="" /></a> </div> --> <div class="logo animated duration-3s bounceInLeft"> <a href="#" rel="contents" title="Апп - Английский без регистрации"><svg class="animated infinite pulse"><use xlink:href="#logo"></use></svg></a> </div> <div class="download-app"> <a href="javascript:void(0);" target="_blank" rel="noopener"><img src="data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20144%2052%27%2F%3E" alt="" /></a> </div> <div class="qrcode"></div> <div id="ya-share2" class="is-social" data-direction="horizontal" data-services="vkontakte,facebook,odnoklassniki,moimir"></div> <div class="vk-like is-social" id="vk-like" data-apiid="4367728"></div> </div> <div class="ripple animated duration-5s"> <img src="https://englishextra.github.io/libs/john-locke/img/ripple-200x200.svg" data-fallback-src="https://englishextra.github.io/libs/john-locke/img/ripple-200x200.png" class="svg-smil-img" alt="" /> </div> <a class="github-fork-ribbon right-bottom" href="https://github.com/englishextra/englishextra.github.io/tree/master/libs/john-locke" target="_blank" rel="noopener" title="Fork me on GitHub" data-ribbon="Fork me on GitHub">Fork me on GitHub</a> <!-- <script src="https://englishextra.github.io/libs/john-locke/js/bundle.min.js"></script> --> <!-- <script src="https://englishextra.github.io/companion.fixed.min.js" type="application/javascript" async="" data-service-worker="https://englishextra.github.io/service-worker.min.js"></script> --> </body> <script src="js/index.js"></script>
</body>
</html>
Asymmetry LP with animate.css & parallax.js - Script Codes CSS Codes
/*! libs\index\scss\bundle.scss */
/*! @import "englishextra-ui-colors" */
/** * englishextra-ui colors * use microsoft.com/en-us/design/color * localhost/tools/Tinter-Shader/index.html * localhost/tools/perfect_colors/ * localhost/tools/TinyColor/index.html * localhost/tools/color-palette-generator/index.html * localhost/tools/hexcolortool/index.html * localhost/tools/css3-playground/ */
/* 0073D2
007DD1
5E308F
9C0087
D13636
F23819
FF4141
00AC54
547E71
8C582C
F5630E
FDE000
C3C3C3
D54848
2D7C9A
2F79B6
EF6B50
EB5262
706D6A
60867B
615FC8
744DA5
3087CD */
/* \$(.*?)\: (.*?)\;
\t\t\t\t\t\t\t\t\t\t$\1\$(.*?)\: (.*?)\;
.bg-\1 { background-color: $\1;
} */
/*! @import "englishextra-ui-variables"; */
/*! * animate.css -http://daneden.me/animate * Version - 3.5.2 * Licensed under the MIT license - http://opensource.org/licenses/MIT * * Copyright (c) 2017 Daniel Eden */
.animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both;
}
.animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite;
}
@-webkit-keyframes pulse { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
}
@keyframes pulse { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
}
.pulse { -webkit-animation-name: pulse; animation-name: pulse;
}
@-webkit-keyframes bounceInDown { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(0, -3000px, 0); transform: translate3d(0, -3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, 25px, 0); transform: translate3d(0, 25px, 0); } 75% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 90% { -webkit-transform: translate3d(0, 5px, 0); transform: translate3d(0, 5px, 0); } to { -webkit-transform: none; transform: none; }
}
@keyframes bounceInDown { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(0, -3000px, 0); transform: translate3d(0, -3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, 25px, 0); transform: translate3d(0, 25px, 0); } 75% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 90% { -webkit-transform: translate3d(0, 5px, 0); transform: translate3d(0, 5px, 0); } to { -webkit-transform: none; transform: none; }
}
.bounceInDown { -webkit-animation-name: bounceInDown; animation-name: bounceInDown;
}
@-webkit-keyframes swing { 20% { -webkit-transform: rotate3d(0, 0, 1, 15deg); transform: rotate3d(0, 0, 1, 15deg); } 40% { -webkit-transform: rotate3d(0, 0, 1, -10deg); transform: rotate3d(0, 0, 1, -10deg); } 60% { -webkit-transform: rotate3d(0, 0, 1, 5deg); transform: rotate3d(0, 0, 1, 5deg); } 80% { -webkit-transform: rotate3d(0, 0, 1, -5deg); transform: rotate3d(0, 0, 1, -5deg); } to { -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg); }
}
@keyframes swing { 20% { -webkit-transform: rotate3d(0, 0, 1, 15deg); transform: rotate3d(0, 0, 1, 15deg); } 40% { -webkit-transform: rotate3d(0, 0, 1, -10deg); transform: rotate3d(0, 0, 1, -10deg); } 60% { -webkit-transform: rotate3d(0, 0, 1, 5deg); transform: rotate3d(0, 0, 1, 5deg); } 80% { -webkit-transform: rotate3d(0, 0, 1, -5deg); transform: rotate3d(0, 0, 1, -5deg); } to { -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg); }
}
.swing { -webkit-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; animation-name: swing;
}
@-webkit-keyframes bounceInRight { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } from { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); } 75% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 90% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); } to { -webkit-transform: none; transform: none; }
}
@keyframes bounceInRight { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } from { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); } 75% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 90% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); } to { -webkit-transform: none; transform: none; }
}
.bounceInRight { -webkit-animation-name: bounceInRight; animation-name: bounceInRight;
}
@-webkit-keyframes bounceInLeft { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); } 75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); } to { -webkit-transform: none; transform: none; }
}
@keyframes bounceInLeft { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); } 75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); } to { -webkit-transform: none; transform: none; }
}
.bounceInLeft { -webkit-animation-name: bounceInLeft; animation-name: bounceInLeft;
}
@-webkit-keyframes bounceInUp { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } from { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 75% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 90% { -webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}
@keyframes bounceInUp { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } from { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 75% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 90% { -webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}
.bounceInUp { -webkit-animation-name: bounceInUp; animation-name: bounceInUp;
}
@-webkit-keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); }
}
@keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); }
}
.bounceOutUp { -webkit-animation-name: bounceOutUp; animation-name: bounceOutUp;
}
@-webkit-keyframes bounceIn { from, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform: scale3d(0.97, 0.97, 0.97); transform: scale3d(0.97, 0.97, 0.97); } to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
}
@keyframes bounceIn { from, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform: scale3d(0.97, 0.97, 0.97); transform: scale3d(0.97, 0.97, 0.97); } to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
}
.bounceIn { -webkit-animation-name: bounceIn; animation-name: bounceIn;
}
@-webkit-keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); }
}
@keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); }
}
.bounceOutDown { -webkit-animation-name: bounceOutDown; animation-name: bounceOutDown;
}
/*! * addings to animate.css */
.duration-3s { -webkit-animation-duration: 3s; animation-duration: 3s;
}
.duration-5s { -webkit-animation-duration: 5s; animation-duration: 5s;
}
/*! @import "ya-share2.fixed"; */
/*! * ya-share2 * yandex.ru/blog/share/kak-uvelichit-shrift-tsifr-sch-tchika#comment-add */
.ya-share2 { -webkit-box-shadow: 0.133rem 0.133rem 0.133rem 0 rgba(50, 50, 50, 0.3); box-shadow: 0.133rem 0.133rem 0.133rem 0 rgba(50, 50, 50, 0.3);
}
.ya-share2 .ya-share2__container_size_m .ya-share2__icon { height: 3.200rem; width: 3.200rem;
}
.ya-share2 .ya-share2__container_size_m .ya-share2__counter { font-size: 1.333rem; line-height: 3.200rem;
}
.ya-share2 .ya-share2__container_size_m .ya-share2__title { width: 0; height: 0; overflow: hidden;
}
.ya-share2 .ya-share2__container_size_m .ya-share2__item { margin: 0;
}
.ya-share2 .ya-share2__container_size_m .ya-share2__badge { border-radius: 0;
}
html,
body { height: 100%;
}
html { font-size: 15px; line-height: 20px;
}
body { font-size: 1.000rem; line-height: 1.333rem; color: #1F1F1F; margin: 0; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent; outline: none;
}
a { color: inherit; -webkit-tap-highlight-color: transparent; outline: none;
}
.wrapper { width: 100%; height: 100%; position: absolute; left: 0; top: 0; line-height: 0; -webkit-transition: opacity .2s ease; transition: opacity .2s ease; overflow: hidden; background-color: #2B2B2B;
}
.scene,
.layer { display: block; height: 100%; width: 100%; padding: 0; margin: 0;
}
.scene { display: block; width: 100%; height: 100%; text-align: center; position: absolute; overflow: hidden; line-height: 0;
}
.layer { position: absolute;
}
.layer img,
.layer canvas { display: block;
}
.hero { width: 50%; min-height: 100%; position: absolute; top: 0; left: 0; opacity: 1; overflow: hidden; background-color: transparent; background-image: url(https://englishextra.github.io/libs/john-locke/img/hero-960x1080.jpg); background-position: center center; background-repeat: no-repeat; background-size: cover;
}
.monolith { width: 50%; min-height: 100%; position: absolute; top: 0; right: 0; opacity: 1; overflow: hidden; background-color: #F03B4C; background-image: url(https://englishextra.github.io/libs/john-locke/img/monolith-960x1080.jpg); background-position: center center; background-repeat: no-repeat; background-size: cover;
}
.monolith:before { content: ""; width: 100%; min-height: 100%; position: absolute; top: 0; right: 0; background-color: #F03B4C; opacity: 0.8;
}
.matreshka { width: 12.800rem; height: 24.000rem; margin: 0; position: absolute; bottom: -5%; left: 5%;
}
.matreshka a { color: inherit; text-decoration: none;
}
.matreshka img,
.matreshka canvas { display: block; width: 12.800rem; height: 24.000rem;
}
.pen { width: 3.400rem; height: 40.000rem; margin: 0; position: absolute; top: -40%; right: 5%;
}
.pen a { color: inherit; text-decoration: none;
}
.pen img,
.pen canvas { display: block; width: 3.400rem; height: 40.000rem;
}
.notebook { width: 21.333rem; height: 30.800rem; margin: 0; position: absolute; bottom: -30%; right: -5%;
}
.notebook a { color: inherit; text-decoration: none;
}
.notebook img,
.notebook canvas { display: block; width: 21.333rem; height: 30.800rem;
}
.john-locke { width: 33.333rem; height: 43.000rem; position: absolute; top: calc(50% - 21.500rem); left: calc(65% - 16.667rem); margin: 0;
}
.john-locke a { color: inherit; text-decoration: none;
}
.john-locke img,
.john-locke canvas { display: block; width: 33.333rem; height: 43.000rem;
}
.signature { width: 21.333rem; height: 8.667rem; position: absolute; top: calc(70% - 4.333rem); left: calc(75% - 10.667rem); margin: 0;
}
.signature a { color: inherit; text-decoration: none;
}
.signature img,
.signature svg { display: block; width: 21.333rem; height: 8.667rem;
}
.quote { min-width: 28.200rem; min-height: 5.400rem; text-align: left; background-color: #3BF0DF; -webkit-box-shadow: 0.133rem 0.133rem 0.133rem 0 rgba(50, 50, 50, 0.3); box-shadow: 0.133rem 0.133rem 0.133rem 0 rgba(50, 50, 50, 0.3); position: absolute; top: calc(25% - 2.700rem); left: calc(35% - 14.100rem); margin: 0;
}
.quote p { display: block; font-size: 1.200rem; font-family: "PT Serif", "Cambria", "Georgia", serif; line-height: 1.500rem; font-weight: 400; color: #1F1F1F; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-right: 1.600rem; margin-left: 1.600rem;
}
.quote a { color: inherit; text-decoration: none;
}
.intro { width: 50%; min-height: 100%; position: absolute; top: 0; left: 0; opacity: 1; overflow: hidden; background-size: cover;
}
.intro h1 { display: block; font-size: 3.333rem; line-height: 4.000rem; font-family: "Roboto Condensed", "Source Sans Pro", "Open Sans", "Exo2", "Fira Sans", "Segoe UI", "Segoe WP", "HelveticaNeue", "Roboto", sans-serif; font-weight: 700; text-transform: uppercase; color: #1F1F1F; background-color: rgba(230, 230, 230, 0.8); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 0; position: absolute; top: 50%; left: 0; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); padding-top: 1.600rem; padding-right: 2.400rem; padding-bottom: 1.600rem; padding-left: 2.400rem;
}
.intro span { display: block; font-size: 2.667rem; line-height: 3.333rem; font-family: "Roboto", "Source Sans Pro", "Open Sans", "Exo2", "Fira Sans", "Segoe UI", "Segoe WP", "HelveticaNeue", "Roboto", sans-serif; font-weight: 400; text-transform: none; border-bottom: 0.267rem solid #F03B4C; padding-bottom: 0.667rem;
}
.intro a { color: inherit; text-decoration: none;
}
.qrcode { display: none; visibility: hidden; opacity: 0; -webkit-transition: visibility 0s, opacity 0.2s ease; transition: visibility 0s, opacity 0.2s ease; width: 8.533rem; height: 8.533rem; position: absolute; top: 5.733rem; right: 1.333rem;
}
.qrcode img { display: block; width: 8.533rem; height: 8.533rem;
}
.download-app { visibility: hidden; opacity: 0; -webkit-transition: visibility 0s, opacity 0.2s ease; transition: visibility 0s, opacity 0.2s ease; width: 8.533rem; height: 3.067rem; position: absolute; top: 1.333rem; right: 1.333rem;
}
.download-app img { display: block; width: 8.533rem; height: 3.067rem;
}
.download-app a { color: inherit; text-decoration: none;
}
.logo { width: 4.000rem; height: 4.000rem; position: absolute; top: 1.333rem; left: 1.333rem;
}
.logo img,
.logo svg { display: block; width: 4.000rem; height: 4.000rem;
}
.logo a { font-size: 0;
}
.arrow { width: 4.000rem; height: 2.400rem; position: absolute; top: 5.333rem; left: 3.200rem;
}
.arrow img,
.arrow svg { display: block; width: 4.000rem; height: 2.400rem;
}
.phone { width: 2.133em; height: 4.267em; margin: 0; position: absolute; top: 2.667rem; left: 6.933rem;
}
.phone img,
.phone svg { display: block; width: 2.133em; height: 4.267em;
}
.phone a { color: inherit; text-decoration: none;
}
.start { display: none; width: 16.000rem; height: 16.000rem; font-size: 0; margin: 0; position: absolute; top: 50%; left: calc(50% - 8.000rem);
}
.start img { display: block; width: 16.000rem; height: 16.000rem;
}
.start a { color: inherit; text-decoration: none;
}
.hand { display: none; width: 8.000rem; height: 3.800rem; font-size: 0; margin: 0; position: absolute; top: calc(50% + 7.050rem); left: calc(50% - 8.000rem);
}
.hand img,
.hand canvas { display: block; width: 8.000rem; height: 3.800rem;
}
.hand a { color: inherit; text-decoration: none;
}
.guesture { display: none; width: 6.400rem; height: 6.400rem; font-size: 0; margin: 0; position: absolute; top: calc(50% + 6.400rem); left: calc(50% - 3.200rem);
}
.guesture img,
.guesture svg { display: block; width: 6.400rem; height: 6.400rem;
}
.btn-share { width: 2.133rem; height: 2.133rem; position: absolute; top: 1.333rem; left: 10.667rem;
}
.btn-share img,
.btn-share svg { display: block; width: 2.133rem; height: 2.133rem;
}
.btn-share a { font-size: 0;
}
.btn-like { width: 2.133rem; height: 2.133rem; position: absolute; top: 1.333rem; left: 14.133rem;
}
.btn-like img,
.btn-like svg { display: block; width: 2.133rem; height: 2.133rem;
}
.btn-like a { font-size: 0;
}
.btn-tutor { width: 3.200rem; height: 3.200rem; position: absolute; bottom: 4.5333rem; left: 5.867rem;
}
.btn-tutor img { display: block; width: 3.200rem; height: 3.200rem;
}
.btn-tutor a { font-size: 0;
}
.btn-vk { width: 3.200rem; height: 3.200rem; position: absolute; bottom: 4.5333rem; left: 1.333rem;
}
.btn-vk img { display: block; width: 3.200rem; height: 3.200rem;
}
.btn-vk a { font-size: 0;
}
.footer { width: 100%; min-height: 3.200rem; position: absolute; bottom: 0; left: 0; text-align: center; opacity: 1; background-color: transparent; background-image: url(https://englishextra.github.io/libs/john-locke/img/dots-8x8.png); background-position: top left; background-repeat: repeat; background-size: 0.533rem 0.533rem;
}
.footer p { display: inline-block; height: 3.200rem; font-family: "Roboto", "Source Sans Pro", "Open Sans", "Exo2", "Fira Sans", "Segoe UI", "Segoe WP", "HelveticaNeue", "Roboto", sans-serif; line-height: 3.200rem; font-size: 0.867rem; font-weight: 700; text-align: center; text-transform: uppercase; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #F2F2F2; background-color: #1F1F1F; padding-right: 1.333rem; padding-left: 1.333rem; margin: 0;
}
.footer a { color: inherit; text-decoration: none;
}
/* .ripple { width: 16.000rem; height: 16.000rem; margin: 0; position: absolute; top: -3.333rem; left: 25%;
}
.ripple img { display: block; width: 16.000rem; height: 16.000rem;
} */
.ya-share2 { display: none; height: 3.200rem; position: absolute; top: 4.933rem; left: 10.667rem;
}
.ya-share2.is-active { display: block;
}
.vk-like { display: none; position: absolute; top: 4.933rem; left: 14.133rem;
}
.vk-like.is-active { display: block;
}
/*! * @see {@link https://gist.github.com/englishextra/40b7c4ffde33bfb58aff259afe229d6a} */
/*------------------------------------------ Foundation Media Queries http://foundation.zurb.com/docs/media-queries.html
--------------------------------------------*/
/* Small screens - MOBILE */
@media only screen { html { font-size: 10px; } .quote { top: calc(20% - 2.700rem); left: calc(35% - 14.100rem); } .intro { width: 100%; } .intro h1 { top: 60%; font-size: 2.400rem; line-height: 3.000rem; } .intro span { font-size: 1.867rem; line-height: 2.400rem; }
}
/* Define mobile styles - Mobile First */
@media only screen and (max-width: 40em) { html { font-size: 10px; }
}
/* max-width 640px, mobile-only styles, use when QAing mobile issues */
/* Medium screens - TABLET */
@media only screen and (min-width: 40.063em) { html { font-size: 15px; } .quote { top: calc(25% - 2.700rem); left: calc(30% - 14.100rem); }
}
/* min-width 641px, medium screens */
@media only screen and (min-width: 40.063em) and (max-width: 64em) { html { font-size: 15px; }
}
/* min-width 641px and max-width 1024px, use when QAing tablet-only issues */
/* Large screens - DESKTOP */
@media only screen and (min-width: 64.063em) { html { font-size: 15px; } .quote { top: calc(25% - 2.700rem); left: calc(35% - 14.100rem); } .intro { width: 50%; } .intro h1 { top: 50%; font-size: 3.333rem; line-height: 4.000rem; } .intro span { font-size: 2.667rem; line-height: 3.333rem; } .qrcode { display: block; }
}
/* min-width 1025px, large screens */
@media only screen and (min-width: 64.063em) and (max-width: 90em) { html { font-size: 15px; }
}
/* min-width 1024px and max-width 1440px, use when QAing large screen-only issues */
/* XLarge screens */
@media only screen and (min-width: 90.063em) { html { font-size: 20px; }
}
/* min-width 1441px, xlarge screens */
@media only screen and (min-width: 90.063em) and (max-width: 120em) { html { font-size: 20px; }
}
/* min-width 1441px and max-width 1920px, use when QAing xlarge screen-only issues */
/* XXLarge screens */
@media only screen and (min-width: 120.063em) { html { font-size: 20px; }
}
/* min-width 1921px, xlarge screens */
/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3Njc3MvYnVuZGxlLnNjc3MiLCIuLi9zY3NzL19lbmdsaXNoZXh0cmEtdWktY29sb3JzLnNjc3MiLCIuLi9zY3NzL19lbmdsaXNoZXh0cmEtdWktdmFyaWFibGVzLnNjc3MiLCIuLi9zY3NzL19hbmltYXRlLnBhcnRpYWwuc2NzcyIsIi4uL3Njc3MvX3lhLXNoYXJlMi5maXhlZC5zY3NzIiwiLi4vc2Nzcy9fbWFpbi5zY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGtDQUFrQztBQ0FsQyx1Q0FBdUM7QUFFdkM7Ozs7Ozs7OztHQVNHO0FBRUg7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7U0FzQlM7QUEwRlQ7Ozs7OztJQU1JO0FDbklKLDJDQUEyQztBQ0EzQzs7Ozs7O0dBTUc7QUFFSDtDQUNDLCtCQUFzQjtTQUF0Qix1QkFBc0I7Q0FDdEIsa0NBQXlCO1NBQXpCLDBCQUF5QixFQUN6Qjs7QUFFRDtDQUNDLDRDQUFtQztTQUFuQyxvQ0FBbUMsRUFDbkM7O0FBRUQ7Q0FDQztFQUNDLG9DQUEyQjtVQUEzQiw0QkFBMkIsRUFBQTtDQUU1QjtFQUNDLDZDQUFvQztVQUFwQyxxQ0FBb0MsRUFBQTtDQUVyQztFQUNDLG9DQUEyQjtVQUEzQiw0QkFBMkIsRUFBQSxFQUFBOztBQVI3QjtDQUNDO0VBQ0Msb0NBQTJCO1VBQTNCLDRCQUEyQixFQUFBO0NBRTVCO0VBQ0MsNkNBQW9DO1VBQXBDLHFDQUFvQyxFQUFBO0NBRXJDO0VBQ0Msb0NBQTJCO1VBQTNCLDRCQUEyQixFQUFBLEVBQUE7O0FBSTdCO0NBQ0MsOEJBQXFCO1NBQXJCLHNCQUFxQixFQUNyQjs7QUFFRDtDQUNDOzs7OztFQUtDLHVFQUFtRTtVQUFuRSwrREFBbUUsRUFBQTtDQUVwRTtFQUNDLFdBQVU7RUFDViw4Q0FBcUM7VUFBckMsc0NBQXFDLEVBQUE7Q0FFdEM7RUFDQyxXQUFVO0VBQ1YsMkNBQWtDO1VBQWxDLG1DQUFrQyxFQUFBO0NBRW5DO0VBQ0MsNENBQW1DO1VBQW5DLG9DQUFtQyxF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 */
Asymmetry LP with animate.css & parallax.js - Script Codes JS Codes
/*jslint browser: true */
/*jslint node: true */
/*global imagesPreloaded, Parallax, platform, QRCode, unescape,
VK, WheelIndicator, Ya */
/*property console, split */
/*! * app logic */
(function (root, document, undefined) { "use strict"; if (!root.console) { root.console = {}; } var con = root.console; var prop, method; var dummy = function () {}; var properties = ["memory"]; var methods = ("assert,clear,count,debug,dir,dirxml,error,exception,group," + "groupCollapsed,groupEnd,info,log,markTimeline,profile,profiles,profileEnd," + "show,table,time,timeEnd,timeline,timelineEnd,timeStamp,trace,warn").split(","); while ((prop = properties.pop())) { if (!con[prop]) { con[prop] = {}; } } while ((method = methods.pop())) { if (!con[method]) { con[method] = dummy; } } var ToProgress = (function () { var TP = function () { var t = function () { var s = document.createElement("fakeelement"), i = { transition: "transitionend", OTransition: "oTransitionEnd", MozTransition: "transitionend", WebkitTransition: "webkitTransitionEnd" }; for (var j in i) { if (i.hasOwnProperty(j)) { if (void 0 !== s.style[j]) { return i[j]; } } } }, s = function (t, a) { if (this.progress = 0, this.options = { id: "top-progress-bar", color: "#F44336", height: "2px", duration: 0.2 }, t && "object" === typeof t) { for (var i in t) { if (t.hasOwnProperty(i)) { this.options[i] = t[i]; } } } if (this.options.opacityDuration = 3 * this.options.duration, this.progressBar = document.createElement("div"), this.progressBar.id = this.options.id, this.progressBar.setCSS = function (t) { for (var a in t) { if (t.hasOwnProperty(a)) { this.style[a] = t[a]; } } }, this.progressBar.setCSS({ position: a ? "relative" : "fixed", top: "0", left: "0", right: "0", "background-color": this.options.color, height: this.options.height, width: "0%", transition: "width " + this.options.duration + "s, opacity " + this.options.opacityDuration + "s", "-moz-transition": "width " + this.options.duration + "s, opacity " + this.options.opacityDuration + "s", "-webkit-transition": "width " + this.options.duration + "s, opacity " + this.options.opacityDuration + "s" }), a) { var o = document.querySelector(a); if (o) { if (o.hasChildNodes()) { o.insertBefore(this.progressBar, o.firstChild); } else { o.appendChild(this.progressBar); } } } else { document.body.appendChild(this.progressBar); } }, i = t(); return s.prototype.transit = function () { this.progressBar.style.width = this.progress + "%"; }, s.prototype.getProgress = function () { return this.progress; }, s.prototype.setProgress = function (t, s) { this.show(); this.progress = t > 100 ? 100 : 0 > t ? 0 : t; this.transit(); if (s) { s(); } }, s.prototype.increase = function (t, s) { this.show(); this.setProgress(this.progress + t, s); }, s.prototype.decrease = function (t, s) { this.show(); this.setProgress(this.progress - t, s); }, s.prototype.finish = function (t) { var s = this; this.setProgress(100, t); this.hide(); if (i) { this.progressBar.addEventListener(i, function (t) { s.reset(); s.progressBar.removeEventListener(t.type, TP); }); } }, s.prototype.reset = function (t) { this.progress = 0; this.transit(); if (t) { t(); } }, s.prototype.hide = function () { this.progressBar.style.opacity = "0"; }, s.prototype.show = function () { this.progressBar.style.opacity = "1"; }, s; }; return TP(); } ()); var progressBar = new ToProgress({ id: "top-progress-bar", color: "#FF2C40", height: "0.200rem", duration: 0.2 }); var hideProgressBar = function () { progressBar.finish(); progressBar.hide(); }; var toStringFn = {}.toString; var supportsSvgSmilAnimation = !!document.createElementNS && (/SVGAnimate/).test(toStringFn.call(document.createElementNS("http://www.w3.org/2000/svg", "animate"))) || ""; if (!supportsSvgSmilAnimation) { progressBar.increase(20); root.addEventListener("load", hideProgressBar); } var gEBCN = "getElementsByClassName"; var gA = "getAttribute"; var supportsSvgAsImg = document.implementation.hasFeature("http://www.w3.org/TR/SVG11/feature#Image", "1.1") || ""; if (!supportsSvgAsImg) { var svgNosmilImages = document[gEBCN]("svg-nosmil-img") || ""; if (svgNosmilImages) { var i; for (i = 0; i < svgNosmilImages.length; i += 1) { svgNosmilImages[i].src = svgNosmilImages[i][gA]("data-fallback-src"); } i = null; } } if (!supportsSvgSmilAnimation) { var svgSmilImages = document[gEBCN]("svg-smil-img") || ""; if (svgSmilImages) { var j; for (j = 0; j < svgSmilImages.length; j += 1) { svgSmilImages[j].src = svgSmilImages[j][gA]("data-fallback-src"); } j = null; } } var gEBTN = "getElementsByTagName"; var aEL = "addEventListener"; var drawImageFromUrl = function (canvasObj, url) { if (!canvasObj || !url) { return; } var img = new Image(); img[aEL]("load", function () { var ctx = canvasObj.getContext("2d"); if (ctx) { ctx.drawImage(img, 0, 0, canvasObj.width, canvasObj.height); } }); img.src = url; }; var canvasAll = document[gEBTN]("canvas") || ""; var cssnum = document.styleSheets.length || 0; var slot; var drawCanvasAll = function () { if (document.styleSheets.length > cssnum) { clearInterval(slot); slot = null; var i; for (i = 0; i < canvasAll.length; i += 1) { if (canvasAll[i][gA]("data-src")) { drawImageFromUrl(canvasAll[i], canvasAll[i][gA]("data-src")); } } i = null; } }; if (canvasAll && cssnum) { slot = setInterval(drawCanvasAll, 100); } var cN = "className"; var pN = "parentNode"; var ripple = document[gEBCN]("ripple")[0] || ""; var rippleParent = ripple ? ripple[pN] || "" : ""; var removeRipple = function () { if (ripple && rippleParent) { rippleParent.removeChild(ripple); } }; var timer3; var deferRemoveRipple = function () { clearTimeout(timer3); timer3 = null; removeRipple(); }; var wrapper = document[gEBCN]("wrapper")[0] || ""; var slot2; var hideRipple = function () { if (imagesPreloaded) { clearInterval(slot2); slot2 = null; /* if (wrapper) { wrapper.style.opacity = 1; } */ if (ripple) { ripple[cN] += " bounceOutUp"; } timer3 = setTimeout(deferRemoveRipple, 5000); if (!supportsSvgSmilAnimation) { progressBar.increase(20); } } }; if ("undefined" !== typeof imagesPreloaded) { if (!supportsSvgSmilAnimation) { removeRipple(); } else { slot2 = setInterval(hideRipple, 100); } } var hasTouch = "ontouchstart" in document.documentElement || ""; var hasWheel = "onwheel" in document.createElement("div") || void 0 !== document.onmousewheel || ""; var loadJsCss = function (files, callback) { var _this = this; _this.files = files; _this.js = []; _this.head = document.getElementsByTagName("head")[0] || ""; _this.body = document.body || ""; _this.ref = document.getElementsByTagName("script")[0] || ""; _this.callback = callback || function () {}; _this.loadStyle = function (file) { var link = document.createElement("link"); link.rel = "stylesheet"; link.type = "text/css"; link.href = file; _this.head.appendChild(link); }; _this.loadScript = function (i) { var script = document.createElement("script"); script.type = "text/javascript"; script.async = true; script.src = _this.js[i]; var loadNextScript = function () { if (++i < _this.js.length) { _this.loadScript(i); } else { _this.callback(); } }; script.onload = function () { loadNextScript(); }; _this.head.appendChild(script); if (_this.ref.parentNode) { _this.ref.parentNode.insertBefore(script, _this.ref); } else { (_this.body || _this.head).appendChild(script); } }; var i, l; for (i = 0, l = _this.files.length; i < l; i += 1) { if ((/\.js$|\.js\?/).test(_this.files[i])) { _this.js.push(_this.files[i]); } if ((/\.css$|\.css\?|\/css\?/).test(_this.files[i])) { _this.loadStyle(_this.files[i]); } } i = null; l = null; if (_this.js.length > 0) { _this.loadScript(0); } else { _this.after(); } }; var getHTTP = (function (type) { return function (force) { force = force || ""; return "http:" === type ? "http" : "https:" === type ? "https" : force ? "http" : ""; }; } (root.location.protocol || "")); var run = function () { var cL = "classList"; var cE = "createElement"; var aC = "appendChild"; if (!supportsSvgSmilAnimation) { progressBar.increase(20); } var qrcode = document[gEBCN]("qrcode")[0] || ""; var timer; var showQrcode = function () { clearTimeout(timer); timer = null; qrcode.style.visibility = "visible"; qrcode.style.opacity = 1; }; if (qrcode) { var locationHref = root.location.href || ""; var qrcodeImg = document[cE]("img"); var qrcodeImgTitle = document.title ? ("Ссылка на страницу «" + document.title.replace(/\[[^\]]*?\]/g, "").trim() + "»") : ""; var qrcodeImgSrc = getHTTP(true) + "://chart.googleapis.com/chart?cht=qr&chld=M%7C4&choe=UTF-8&chs=300x300&chl=" + encodeURIComponent(locationHref); qrcodeImg.alt = qrcodeImgTitle; if (root.QRCode) { if (document.implementation.hasFeature("http://www.w3.org/2000/svg", "1.1")) { qrcodeImgSrc = QRCode.generateSVG(locationHref, { ecclevel: "M", fillcolor: "#FFFFFF", textcolor: "#191919", margin: 4, modulesize: 8 }); var XMLS = new XMLSerializer(); qrcodeImgSrc = XMLS.serializeToString(qrcodeImgSrc); qrcodeImgSrc = "data:image/svg+xml;base64," + root.btoa(unescape(encodeURIComponent(qrcodeImgSrc))); qrcodeImg.src = qrcodeImgSrc; } else { qrcodeImgSrc = QRCode.generatePNG(locationHref, { ecclevel: "M", format: "html", fillcolor: "#FFFFFF", textcolor: "#1F1F1F", margin: 4, modulesize: 8 }); qrcodeImg.src = qrcodeImgSrc; } } else { qrcodeImg.src = qrcodeImgSrc; } qrcodeImg.title = qrcodeImgTitle; qrcode[aC](qrcodeImg); timer = setTimeout(showQrcode, 2000); } var gEBTN = "getElementsByTagName"; var downloadApp = document[gEBCN]("download-app")[0] || ""; var downloadAppLink = downloadApp ? downloadApp[gEBTN]("a")[0] || "" : ""; var downloadAppImg = downloadApp ? downloadApp[gEBTN]("img")[0] || "" : ""; var navigatorUserAgent = navigator.userAgent || ""; var getHumanDate = function () { var newDate = (new Date()); var newDay = newDate.getDate(); var newYear = newDate.getFullYear(); var newMonth = newDate.getMonth(); (newMonth += 1); if (10 > newDay) { newDay = "0" + newDay; } if (10 > newMonth) { newMonth = "0" + newMonth; } return newYear + "-" + newMonth + "-" + newDay; } (); if (navigatorUserAgent && downloadApp && downloadAppLink && downloadAppImg && root.platform) { var downloadAppImgSrc; var downloadAppLinkHref; var platformName = platform.name || ""; var platformDescription = platform.description || ""; document.title = document.title + " [" + (getHumanDate ? " " + getHumanDate : "") + (platformDescription ? " " + platformDescription : "") + ((hasTouch || hasWheel) ? " with" : "") + (hasTouch ? " touch" : "") + ((hasTouch && hasWheel) ? "," : "") + (hasWheel ? " mousewheel" : "") + "]"; var platformOsFamily = platform.os.family || ""; var platformOsVersion = platform.os.version || ""; var platformOsArchitecture = platform.os.architecture || ""; /* console.log(navigatorUserAgent); console.log(platform.os); console.log(platformName + "|" + platformOsFamily + "|" + platformOsVersion + "|" + platformOsArchitecture + "|" + platformDescription); */ if (platformOsFamily.indexOf("Windows Phone", 0) !== -1 && "10.0" === platformOsVersion) { downloadAppImgSrc = "https://englishextra.github.io/libs/products/img/download_wp_app_144x52.svg"; downloadAppLinkHref = "#"; } else if (platformName.indexOf("IE Mobile", 0) !== -1 && ("7.5" === platformOsVersion || "8.0" === platformOsVersion || "8.1" === platformOsVersion)) { downloadAppImgSrc = "https://englishextra.github.io/libs/products/img/download_wp_app_144x52.svg"; downloadAppLinkHref = "#"; } else if (platformOsFamily.indexOf("Windows", 0) !== -1 && 64 === platformOsArchitecture) { downloadAppImgSrc = "https://englishextra.github.io/libs/products/img/download_windows_app_144x52.svg"; downloadAppLinkHref = "#"; } else if (platformOsFamily.indexOf("Windows", 0) !== -1 && 32 === platformOsArchitecture) { downloadAppImgSrc = "https://englishextra.github.io/libs/products/img/download_windows_app_144x52.svg"; downloadAppLinkHref = "#"; } else if (navigatorUserAgent.indexOf("armv7l", 0) !== -1) { downloadAppImgSrc = "https://englishextra.github.io/libs/products/img/download_linux_app_144x52.svg"; downloadAppLinkHref = "#"; } else if (navigatorUserAgent.indexOf("X11", 0) !== -1 && navigatorUserAgent.indexOf("Linux") !== -1 && 64 === platformOsArchitecture) { downloadAppImgSrc = "https://englishextra.github.io/libs/products/img/download_linux_app_144x52.svg"; downloadAppLinkHref = "#"; } else if (navigatorUserAgent.indexOf("X11", 0) !== -1 && navigatorUserAgent.indexOf("Linux") !== -1 && 32 === platformOsArchitecture) { downloadAppImgSrc = "https://englishextra.github.io/libs/products/img/download_linux_app_144x52.svg"; downloadAppLinkHref = "#"; } else { if (platformOsFamily.indexOf("Android", 0) !== -1) { downloadAppImgSrc = "https://englishextra.github.io/libs/products/img/download_android_app_144x52.svg"; downloadAppLinkHref = "#"; } } var timer2; var showDownloadApp = function () { clearTimeout(timer2); timer2 = null; downloadApp.style.visibility = "visible"; downloadApp.style.opacity = 1; }; if (downloadAppImgSrc && downloadAppLinkHref) { downloadAppLink.href = downloadAppLinkHref; downloadAppLink.rel = "noopener"; downloadAppLink.target = "_blank"; downloadAppLink.title = "Скачать приложение"; if (!supportsSvgAsImg) { downloadAppImgSrc = downloadAppImgSrc.slice(0, -3) + "png"; } downloadAppImg.src = downloadAppImgSrc; timer2 = setTimeout(showDownloadApp, 1000); } } var gEBI = "getElementById"; var ds = "dataset"; var scene = document[gEBI]("scene") || ""; var parallax; if (scene && root.Parallax) { parallax = new Parallax(scene); } var guesture = document[gEBCN]("guesture")[0] || ""; var revealStart = function () { var start = document[gEBCN]("start")[0] || ""; var hand = document[gEBCN]("hand")[0] || ""; if (start) { start[cL].add("bounceInUp"); start.style.display = "block"; } if (hand) { hand[cL].add("bounceInUp"); hand.style.display = "block"; } if (guesture) { guesture[cL].add("bounceOutUp"); } }; if (wrapper) { var mousewheeldown = document[gEBCN]("mousewheeldown")[0] || ""; var swipeup = document[gEBCN]("swipeup")[0] || ""; if (hasTouch) { mousewheeldown.style.display = "none"; if (root.tocca) { root[aEL]("swipeup", revealStart, { passive: true }); } } else { if (hasWheel) { swipeup.style.display = "none"; if (root.WheelIndicator) { var indicator; indicator = new WheelIndicator({ elem: wrapper, callback: function (e) { if ("down" === e.direction) { revealStart(); } }, preventMouse: false }); } } } if (hasTouch || hasWheel) { guesture[cL].add("bounceInUp"); guesture.style.display = "block"; } } var scriptIsLoaded = function (s) { for (var b = document.getElementsByTagName("script") || "", a = 0; a < b.length; a += 1) { if (b[a].getAttribute("src") === s) { return true; } } return false; }; var debounce = function (func, wait, immediate) { var timeout, args, context, timestamp, result; if (undefined === wait || null === wait) { wait = 100; } function later() { var last = Date.now() - timestamp; if (last < wait && last >= 0) { timeout = setTimeout(later, wait - last); } else { timeout = null; if (!immediate) { result = func.apply(context, args); context = args = null; } } } var debounced = function () { context = this; args = arguments; timestamp = Date.now(); var callNow = immediate && !timeout; if (!timeout) { timeout = setTimeout(later, wait); } if (callNow) { result = func.apply(context, args); context = args = null; } return result; }; debounced.clear = function () { if (timeout) { clearTimeout(timeout); timeout = null; } }; debounced.flush = function () { if (timeout) { result = func.apply(context, args); context = args = null; clearTimeout(timeout); timeout = null; } }; return debounced; }; var hideOtherIsSocial = function (_this) { _this = _this || this; var isSocialAll = document[gEBCN]("is-social") || ""; if (isSocialAll) { var k; for (k = 0; k < isSocialAll.length; k += 1) { if (_this !== isSocialAll[k]) { isSocialAll[k][cL].remove("is-active"); } } k = null; } }; root[aEL]("click", hideOtherIsSocial); var btnShare = document[gEBCN]("btn-share")[0] || ""; var btnShareLink = btnShare ? btnShare[gEBTN]("a")[0] || "" : ""; var yaShare2Id = "ya-share2"; var yaShare2 = document[gEBI](yaShare2Id) || ""; var yshare; var showShareButtons = function (ev) { ev.preventDefault(); ev.stopPropagation(); var logicShowShareButtons = function () { yaShare2[cL].toggle("is-active"); hideOtherIsSocial(yaShare2); var initScript = function () { if (root.Ya) { try { if (yshare) { yshare.updateContent({ title: document.title || "", description: document.title || "", url: root.location.href || "" }); } else { yshare = Ya.share2(yaShare2Id, { content: { title: document.title || "", description: document.title || "", url: root.location.href || "" } }); } } catch (err) { /* console.log("cannot update or init Ya.share2", err); */ } } }; var jsUrl = getHTTP(true) + "://yastatic.net/share2/share.js"; if (!scriptIsLoaded(jsUrl)) { var load; load = new loadJsCss([jsUrl], initScript); } else { initScript(); } }; var debounceLogicShowShareButtons = debounce(logicShowShareButtons, 200); debounceLogicShowShareButtons(); }; if (btnShareLink && yaShare2) { btnShareLink[aEL]("click", showShareButtons); } var btnLike = document[gEBCN]("btn-like")[0] || ""; var btnLikeLink = btnLike ? btnLike[gEBTN]("a")[0] || "" : ""; var vkLike = document[gEBCN]("vk-like")[0] || ""; var showVkLike = function (ev) { ev.preventDefault(); ev.stopPropagation(); var logicShowVkLike = function () { vkLike[cL].toggle("is-active"); hideOtherIsSocial(vkLike); var initScript = function () { if (vkLike && root.VK) { try { VK.init({ apiId: (vkLike[ds].apiid || ""), nameTransportPath: "/xd_receiver.htm", onlyWidgets: true }); VK.Widgets.Like("vk-like", { type: "button", height: 24 }); } catch (err) { /* console.log("cannot init VK", err); */ } } }; var jsUrl = getHTTP(true) + "://vk.com/js/api/openapi.js?147"; if (!scriptIsLoaded(jsUrl)) { var load; load = new loadJsCss([jsUrl], initScript); } }; var debounceLogicShowVkLike = debounce(logicShowVkLike, 200); debounceLogicShowVkLike(); }; if (btnLikeLink && vkLike) { btnLikeLink[aEL]("click", showVkLike); } }; var scriptsArray = [getHTTP(true) + "://fonts.googleapis.com/css?family=PT+Serif:400,400i%7CRoboto:400,700%7CRoboto+Condensed:700&subset=cyrillic", /* "https://englishextra.github.io/libs/john-locke/css/bundle.min.css", */ getHTTP(true) + "://cdnjs.cloudflare.com/ajax/libs/github-fork-ribbon-css/0.2.0/gh-fork-ribbon.min.css"]; var supportsClassList = "classList" in document.createElement("_") || ""; if (!supportsClassList) { scriptsArray.push(getHTTP(true) + "://cdn.jsdelivr.net/npm/[email protected]/classList.min.js"); } var supportsDataset = "undefined" !== typeof root.Element && "dataset" in document.documentElement || ""; if (!supportsDataset) { scriptsArray.push(getHTTP(true) + "://cdn.jsdelivr.net/npm/[email protected]/lib/browser/index.cjs.min.js"); } var supportsPassive = false; try { var opts = Object.defineProperty && Object.defineProperty({}, 'passive', { get: function () { supportsPassive = true; } }); root.addEventListener('test', function () {}, opts); } catch (err) {} if (!supportsPassive) { scriptsArray.push(getHTTP(true) + "://cdnjs.cloudflare.com/ajax/libs/dom4/1.8.3/dom4.js"); } scriptsArray.push(getHTTP(true) + "://cdn.jsdelivr.net/npm/[email protected]/dist/parallax.min.js", getHTTP(true) + "://cdn.jsdelivr.net/npm/[email protected]/qrjs2.min.js", getHTTP(true) + "://cdn.jsdelivr.net/npm/[email protected]/platform.min.js"); if (hasTouch) { scriptsArray.push(getHTTP(true) + "://cdnjs.cloudflare.com/ajax/libs/Tocca.js/2.0.1/Tocca.min.js"); } else { if (hasWheel) { /* scriptsArray.push(getHTTP(true) + "://cdn.jsdelivr.net/npm/[email protected]/lib/wheel-indicator.min.js"); */ scriptsArray.push("https://englishextra.github.io/cdn/wheel-indicator/1.1.4/js/wheel-indicator-passive.fixed.min.js"); } } var load; load = new loadJsCss(scriptsArray, run);
} (window, document));
| Developer | Englishextra |
| Username | englishextra |
| Uploaded | January 17, 2023 |
| Rating | 4.5 |
| Size | 24,971 Kb |
| Views | 6,072 |
Do you need developer help for Asymmetry LP with animate.css & parallax.js?
Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!
Englishextra (englishextra) Script Codes
| Name | Size |
| A Pen by englishextra | 6,117 Kb |
| QR code generating with vanilla js | 5,758 Kb |
| Ready-to-Go Three-columns Responsive Typography Template with Off-Canvas Navigation | 18,977 Kb |
| Parallax.js | 11,997 Kb |
| Blog Article Template | 14,860 Kb |
| Timeline Blueprint | 5,154 Kb |
| Responsive Flexbox Administration | 7,376 Kb |
| Core.css | 4,958 Kb |
| Grid 2 Go | 3,049 Kb |
| JSON based picture gallery with lazyloading | 10,270 Kb |
Create amazing blog posts with AI!
Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!
Similar Scripts & Codes
| Name | Username | Size |
| Midterm dry run | Jds317 | 1,649 Kb |
| Button shaking | SusanneLundblad | 2,227 Kb |
| Tab Menus | Zephyr | 3,180 Kb |
| Blog Concept 2 | JGallardo | 2,994 Kb |
| Smoke Shader - Frame Buffer | Omarshe7ta | 2,672 Kb |
| A Pen by John Malc | F789gh | 1,420 Kb |
| Basecamp 3 Document | Lachlanjc | 3,811 Kb |
| Image Stack Test SCSS | CalvinMorett | 2,799 Kb |
| Google Chrome Icon using Pure CSS in one DIV | Grssam | 3,627 Kb |
| Animated bar chart | CreativePunch | 3,124 Kb |
Do you want hide your ip address?
Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!