I had a number of friends with small sites who weren't extremely literate when it came to html/js, but who wanted to join in with the January 18th site blackout. We ended up creating this. It's a small one line piece of JS that people can add for a simple blackout wall with information on SOPA/PIPA.
Author of the js side here. I'll definitely look into seeing how much extra bulk will be needed for this. We're trying to keep the file as small as possible and generally as cross-browser friendly as possible.
Great idea! I think it could be improved with a minor adjustment. The first thing I saw on that page was "(click here to continue)", which I did before I realized there was text at the top of the screen. You see, "(click here to continue)" is something I see on a lot of pop-over ads and splash-screens, so my brain has been trained to blindly click through to the next page. I think with some minor adjustments, the heading can be made more prominent.
An option to have this activate only on the 18th would be great. I'd kinda like to include the code now but have it do nothing until the 18th. Also, is the "sopablackout_id = 'element-id'" option working? Didn't seem to do anything different for me.
In my testing it does. If you've set that option and it doesn't look any different, then perhaps the element you're attaching to is the full size of the page? The attach-to-element feature is for people who say, only wanted to cover the header of their site. There's some hack in there to figure out the position and height of that element and have the popover cover that (also, if the element is too small, the popover might be larger such that the message shows). Always open to bug reports.
I like the idea, but the visuals could be improved. Maybe try a modal window, similar to the "Website Blocked" SOPA mock images, but changing the text and wording. Maybe include a link to the infographic http://americancensorship.org/infographic.html
I've created a WordPress plugin for this - it contains the JavaScript file locally to reduce the potential load on the js.sopablackout.org domain. YMMV.
That's a great suggestion, but the js snippet does not rely on any external toolkit that would make cross-browser text fading easy to do. Everything it needs to work it provides for itself. It's not even minified but ends up 1.7KB gzipped. I kinda like it that way.
Also, the snippet is really meant for people who can't do this on their own - really, someone with beginner jQuery skills can probably create this on their own site in 10 minutes, so forgive it for being bare bones.
Great idea. If this gets wide adoption, which I hope it does, you'll want to ensure that your Javascript code is on a fast CDN or hosted locally, otherwise the sites will stall loading it.
I've got a lot of faith in varnish, so I'm pretty sure things should hold up on this end. However, yes, if you are worried about relying on an external resource by all means curl/wget/whatever the js file and server it up yourself. You just won't get any fixes or features we push in the meantime.
