To use this website fully, you first need to accept the use of cookies. By agreeing to the use of cookies you consent to the use of functional cookies. For more information read this page.

Simple script to hide expletive words

When I first released my website, there were occasional pages with expletives within them but as my website became more and more public and eventually used within my role as a teaching assistant I had to make the decision - remove them all or just hide them.

At first, the latter appealed to me more. I developed a JavaScript (using jQuery) script that would simply hide the words and show them when the user hovers over the word. I have since decided to remove this in favour of removing the words altogether but I thought I'd share my original code with you:

JavaScript
//Swear words
if (showSwearing) {
	jQuery(".swear").mouseenter(function() {
		var sword = jQuery(this).attr("data-sword");
		var nword = jQuery(this).html();
		jQuery(this).attr("data-nword", nword);
		jQuery(this).html(sword);
	})
	.mouseleave(function() {
		var m = jQuery(this).attr("data-nword");
		jQuery(this).html(m);
	});
}

This very simple script works on the basis that each word contains an nword (normal word) and sword (swear word) set in the data attributes on the span element that contains the word. As I say, it's a simple little implementation that works well enough for the job, but you could do it quite easily with CSS.

Comments

There are no comments on this page.

New comment
Reply
Powered by DASH 2.0 (beta)
Code previewClose