andy-h
3/21/2017 - 5:02 PM

CSS to obfuscate text until you hover over it. I got this idea from https://www.reddit.com/r/MumboJumboFanServer/ where similar CSS is used

CSS to obfuscate text until you hover over it. I got this idea from https://www.reddit.com/r/MumboJumboFanServer/ where similar CSS is used to hide spoilers.

fuzzySpoiler.htm
content_copyfile_download
<!DOCTYPE html>

<html lang="en">
<head>
	
	<meta charset="UTF-8">
	
	<title>CSS to obfuscate text</title>
	
	<style>
		.spoiler:not(:hover), .spoiler:not(:hover) * {
			color:transparent !important;
		}
		.spoiler:not(:hover) {
			text-shadow:0 0 12px #4D5763;
		}
		.spoiler {
			transition:color 0.25s ease, text-shadow 0.25s ease;
		}
		.spoiler * {
			transition:color 0.25s ease;
		}
	</style>
	
</head>
<body>
	
	<span class="spoiler">This awesome <span style="color:red;">spoiler</span> has a <a href="#">link</a>!</span>
	
</body>
</html>