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:
//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.
