Shake it
How do I make an shake it?
What is a shake it? How do you make a shake it? This script and codes were developed by Rahul Kumar on 14 October 2022, Friday.
Shake it - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Shake it</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="thing"> <h1>Você é mais doce do que o chocolate.</h1>
</div>
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" class="squiggly-filters"> <defs> <filter id="squiggly-0"> <feTurbulence baseFrequency="0.02" numOctaves="3" result="noise" seed="0" /> <feDisplacementMap in="SourceGraphic" in2="noise" scale="6" /> </filter> <filter id="squiggly-1"> <feTurbulence baseFrequency="0.02" numOctaves="3" result="noise" seed="1" /> <feDisplacementMap in="SourceGraphic" in2="noise" scale="8" /> </filter> <filter id="squiggly-2"> <feTurbulence baseFrequency="0.02" numOctaves="3" result="noise" seed="2" /> <feDisplacementMap in="SourceGraphic" in2="noise" scale="6" /> </filter> <filter id="squiggly-3"> <feTurbulence baseFrequency="0.02" numOctaves="3" result="noise" seed="3" /> <feDisplacementMap in="SourceGraphic" in2="noise" scale="8" /> </filter> <filter id="squiggly-4"> <feTurbulence baseFrequency="0.02" numOctaves="3" result="noise" seed="4" /> <feDisplacementMap in="SourceGraphic" in2="noise" scale="6" /> </filter> </defs>
</svg>
</body>
</html>
Shake it - Script Codes CSS Codes
*, *:before, *:after { margin: 0; padding: 0; -moz-box-shadow: border-box; -webkit-box-shadow: border-box; box-shadow: border-box;
}
*:before, *:after { content: "";
}
html, body { height: 100%;
}
body { display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; font-size: 100%; font-family: monospace; background-color: #1e1e1e; color: #fff;
}
.squiggly-filters { display: none;
}
.thing { padding: 1em; width: 100%;
}
.thing h1 { font-size: 3em; text-align: center; -moz-animation: squiggly 0.25s linear infinite; -webkit-animation: squiggly 0.25s linear infinite; animation: squiggly 0.25s linear infinite;
}
@-moz-keyframes squiggly { 0% { filter: url("#squiggly-0"); } 25% { filter: url("#squiggly-1"); } 50% { filter: url("#squiggly-2"); } 75% { filter: url("#squiggly-3"); } 100% { filter: url("#squiggly-4"); }
}
@-webkit-keyframes squiggly { 0% { -webkit-filter: url("#squiggly-0"); filter: url("#squiggly-0"); } 25% { -webkit-filter: url("#squiggly-1"); filter: url("#squiggly-1"); } 50% { -webkit-filter: url("#squiggly-2"); filter: url("#squiggly-2"); } 75% { -webkit-filter: url("#squiggly-3"); filter: url("#squiggly-3"); } 100% { -webkit-filter: url("#squiggly-4"); filter: url("#squiggly-4"); }
}
@keyframes squiggly { 0% { -webkit-filter: url("#squiggly-0"); filter: url("#squiggly-0"); } 25% { -webkit-filter: url("#squiggly-1"); filter: url("#squiggly-1"); } 50% { -webkit-filter: url("#squiggly-2"); filter: url("#squiggly-2"); } 75% { -webkit-filter: url("#squiggly-3"); filter: url("#squiggly-3"); } 100% { -webkit-filter: url("#squiggly-4"); filter: url("#squiggly-4"); }
}
Developer | Rahul Kumar |
Username | rk007 |
Uploaded | October 14, 2022 |
Rating | 3 |
Size | 2,486 Kb |
Views | 32,384 |
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!
Name | Size |
A Pen by Rahul Kumar | 42,970 Kb |
HeartIt | 2,039 Kb |
For you | 6,495 Kb |
Chat | 5,136 Kb |
Coffee | 2,681 Kb |
Bitch Roxana | 2,983 Kb |
You | 2,640 Kb |
Hmmm... | 4,848 Kb |
Hey | 4,289 Kb |
- | 2,286 Kb |
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!
Name | Username | Size |
Fixed with using Calc | Tomleo | 2,542 Kb |
Dribbble Template | ExtremelyGinger | 2,204 Kb |
Konami Code Easter Egg | Teolitto | 3,051 Kb |
Toolbar | Onsen | 5,414 Kb |
Social buttons | Flacu | 2,022 Kb |
NT Tribute | Skybutterfly | 2,850 Kb |
APortfolio | Skybutterfly | 5,174 Kb |
React Vote Component | Souporserious | 5,465 Kb |
Tumblr API | Juanv911 | 2,436 Kb |
BenU Maintenance Site | Ksherman | 4,893 Kb |
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!