Since you lot were so enamored with my previous seizure-inducing ode to Blinky the wonder tag, here's something even worse! A twitching, blinking, color-shifting monstrosity that will terribly frighten and/or nauseate all viewers. Be sure to share it with your friends!
Much like last time, we first simply apply a "class" tag to any elements we want this technique to apply to. But to really fuck things up we throw a whole shitload of nested <div> tags in the mix:
<div class='blonk'> <div class='blonk'> <div class='blonk'> (etc...) <p class='blonk'>Some shit goes here</p> </div> </div> </div> (etc...)
And then we write just a tiny bit more code, simiilar but much worse than the last:
<script type="text/javascript">
//Two timers to make it kinda jerky and twitchy:
var longdelay=100; // change to adjust speed
var shortdelay=10;
var delay=longdelay;
var positive = 0;
// Evil array of evil color evilness:
var colors=["#ff00ff","#ffff00","#00ffff","#880088","#ff8800","#ff0000","#00ff00","#0000FF"];
var c=0;
function blonk() {
var annoyances = document.getElementsByClassName('blonk');
for (var i=annoyances.length - 1; i>=0; i--) {
var b = annoyances[i];
b.style.border="0.5em solid " + colors[c];
if (positive === 1) {
b.style.visibility = (b.style.visibility === 'visible') ? 'hidden' : 'visible';
positive = 0;
} else {
b.style.visibility = (b.style.visibility === 'hidden') ? 'visible' : 'hidden';
positive = 1;
}
if (i>=c) { // make the blinking a bit twitchy
delay=(longdelay * 3)/2.5 + (shortdelay *c);
} else {
delay=shortdelay;
}
if (c < colors.length) {
c++;
} else {
c=0;
positive=1;
}
b.style.color=colors[c];
}
window.setTimeout(blonk, delay);
}
blonk();
</script>
And the result is gloriously, hideously, afwul!
Now that's just plain fucked up!
Nonnie is nonplussed by your blinkiness.
ReplyDelete~
What nonnie? I think you're imagining things...
ReplyDeleteI'm not the one that said something about a challenge...
ReplyDeleteI may have to make these a recurring feature.