Thursday, April 17th, 2008

NSFW Blocker Using MooTools

Category: MooTools

I like reading David Walsh’s blog. Not only does he write good technical articles but he always injects some humor into it to liven up the topic. This time around is no different as David’s guilty pleasure of scoping out the latest celebrity gossip led him to an idea which would make it easier for these sites to post NSFW pictures without their readers having to end up in HR.

Since most of the time it’s just a portion of a given picture that could be considered in appropriate, I asked myself if there was a way to get the gist of an article’s graphic without having to hide the entire image. For that reason, I’ve created a NSFW blocker using CSS and MooTools.

The premise of the extension is to give the reader an idea of what is going on without actually landing him/her in trouble due to inappropriate content. The script is very easy to implement as it loops through all divs that have a class of “nsfw-wrapper” and adjusts the mouseenter & mouseleave events to fade in or out using MooTools fade() method.

It’s a very simple extension but definitely useful. You can see the demo here.

Posted by Rey Bango at 9:18 am
3 Comments

+++--
3.8 rating from 26 votes

3 Comments »

Comments feed TrackBack URI

Fun idea but I think the main problem with NSFW stuff is the images getting logged etc. in the company caches. After all, the image is still being sent to the browser.

I like the red though ;-)

Comment by Russ — April 17, 2008

for fun ported to Prototype :P
http://pastie.caboo.se/182396

Comment by jdalton — April 17, 2008

o_O what happened to simply blocking images when surfing potentially NSFW sites at work ?

Comment by p01 — April 17, 2008

Leave a comment

You must be logged in to post a comment.