Pile of Letters
How do I make an pile of letters?
What is a pile of letters? How do you make a pile of letters? This script and codes were developed by Jerusha Johnson on 22 October 2022, Saturday.
Pile of Letters - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Pile of Letters</title> <link href='https://fonts.googleapis.com/css?family=Ubuntu+Condensed|Open+Sans' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css"> <link rel='stylesheet prefetch' href='https://netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.css'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <section class="grid f1 container text-center"> You're looking so well darling, you really are. I don't know what sort of cream they put on you down at the morgue, but I want some.
</section> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> <script src="js/index.js"></script>
</body>
</html>
Pile of Letters - Script Codes CSS Codes
html,body{ background: #1e1e1e; height:100%; width:100%;
}
.f1 { font-family:'Ubuntu Condensed'; -webkit-text-fill-color: transparent; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: #fefefe;
}
.letterBlock { font-size:700px; position:absolute; top:0; left:0; color: black;
}
Pile of Letters - Script Codes JS Codes
letters = $('.grid').text().split('');
letterList = [];
$('.grid').html('');
function newLetter(l) { var $letter = $('<div class="letterBlock col-md-12 ">'+l+'</div>'); return $letter;
}
$.each(letters, function(i,j) { letterList.push(newLetter(j));
});
$.each(letterList, function(n,k) { $('.grid').append(k);
});
Developer | Jerusha Johnson |
Username | bonzaipenguin |
Uploaded | October 22, 2022 |
Rating | 3 |
Size | 2,120 Kb |
Views | 16,192 |
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 |
Medium-esque v2.0 | 2,335 Kb |
Scaled Agile Card Heights | 2,113 Kb |
New BookStrap | 1,992 Kb |
Mobile Calendar Test | 3,456 Kb |
Photo Week Bug | 1,926 Kb |
Type Specimen | 2,414 Kb |
X-axis and Y-axis Affixes | 3,803 Kb |
Wedding Announcement Idea | 2,506 Kb |
Parallax Scroll 2.0 | 2,393 Kb |
Objects 2.0 | 3,082 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 |
Sidebar Thing | Jonambas | 2,779 Kb |
Using Flickr API | MoyArt | 6,761 Kb |
Google Chrome Icon using Pure CSS in one DIV | Grssam | 3,627 Kb |
Testing Portfolio Page | Sideshowli | 3,395 Kb |
Two tables and header with jspdf-autotable | Someatoms | 2,245 Kb |
Basic HTML Slideshow | Tomhodgins | 3,386 Kb |
Z-index demo | Kblh | 1,534 Kb |
A Pen by lizz | Lizz | 10,068 Kb |
A Pen by Adrien Clerbois | AClerbois | 6,501 Kb |
Opening Reveal Modal On Document Ready | Winghouchan | 1,787 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!