Random word highlight script

Size
3,578 Kb
Views
80,960

How do I make an random word highlight script?

What is a random word highlight script? How do you make a random word highlight script? This script and codes were developed by Moses Holmström on 21 August 2022, Sunday.

Random word highlight script Previews

Random word highlight script - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Random word highlight script</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="quote" id="neat">A year here and he still dreamed of cyberspace, hope fading nightly. All the speed he took, all the turns he'd taken and the corners he cut in Night City, and he'd still see the matrix in his dreams, bright lattices of logic unfolding across that colourless void... The Sprawl was a long, strange way home now over the Pacific, and he was no Console Man, no cyberspace cowboy. Just another hustler, trying to make it through. But the dreams came on in the Japanese night like livewire voodoo, and he'd cry for it, cry in his sleep, and wake alone in the dark, curled in his capsule in some coffin hotel, hands clawed into the bedslab, temper foam bunched between his fingers, trying to reach the console that wasn't there.</div> <script src="js/index.js"></script>
</body>
</html>

Random word highlight script - Script Codes CSS Codes

@import url(http://fonts.googleapis.com/css?family=VT323);
html { background-color: #0c0a0e; font-family: "M+ 1mn", "VT323", monospace; font-size: 2.2vmax; line-height: 1.75em; overflow: hidden;
}
.quote { cursor: default; color: #00331a; margin: 0 auto 0; max-width: 82vw; -webkit-perspective: 1000vmin; perspective: 1000vmin; width: 33rem;
}
.quote span { border-radius: 0.3em; display: inline-block; padding: 0 0.25em; margin: 0.1em 0.1em; -webkit-transform: translateZ(-500vmin) rotateX(90deg); transform: translateZ(-500vmin) rotateX(90deg); -webkit-transition: background 2s ease-in, color 5s ease-out, text-shadow 0.5s ease-out, -webkit-transform 15s ease-in; transition: background 2s ease-in, color 5s ease-out, text-shadow 0.5s ease-out, -webkit-transform 15s ease-in; transition: background 2s ease-in, color 5s ease-out, text-shadow 0.5s ease-out, transform 15s ease-in; transition: background 2s ease-in, color 5s ease-out, text-shadow 0.5s ease-out, transform 15s ease-in, -webkit-transform 15s ease-in;
}
.quote .highlight, .quote span:hover { background: rgba(0, 255, 128, 0.1); color: #80ffc0; text-shadow: 0 0 0.6em #00ff80; -webkit-transform: translateZ(0) rotateX(0deg); transform: translateZ(0) rotateX(0deg); -webkit-transform-origin: 50% 100%; transform-origin: 50% 100%; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; z-index: 9001;
}

Random word highlight script - Script Codes JS Codes

var eQuote = document.querySelector("#neat");
var regex = /\ /;
// save the original paragraph as array of words
// regex = /[,.?!;:]/; /* Uncomment for sentences */
var aQuote = eQuote.innerHTML.split(regex);
// wrap each word with a span
eQuote.innerHTML = "";
for(var word in aQuote){ eQuote.innerHTML += "<span>" + aQuote[word] + "</span>";
}
// ...and save them for later
var eWords = document.querySelectorAll("span");
var repeat = setInterval(function() { if(Math.random() > 0.85) fClearAllHighlights(eQuote); fHighlightRandomWord(eWords);
}, 275);
function fHighlightRandomWord (e) { var iRandom = Math.floor(Math.random() * e.length); e[iRandom].classList.add("highlight");
}
function fClearAllHighlights (e) { var nlHighlights = e.querySelectorAll(".highlight"); // convert the nodeList into an array var aHighlights = Array.prototype.slice.call(nlHighlights); // remove .highlight from the spans which have it Array.prototype.map.call(aHighlights, function(){ arguments[0].classList.remove("highlight"); });
}
Random word highlight script - Script Codes
Random word highlight script - Script Codes
Home Page Home
Developer Moses Holmström
Username thykka
Uploaded August 21, 2022
Rating 4.5
Size 3,578 Kb
Views 80,960
Do you need developer help for Random word highlight script?

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!

Moses Holmström (thykka) Script Codes
Create amazing SEO content 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!