2 May 2007

CSS Mutation with JavaScript

What do you get when you apply someone else’s style on your website … Someone smarter than me called it a CSS love child … which is an awesome experiment … but i wanted a something that i could use on any website no matter where i was … and hence born my CSS mutation …

So first the example … LET’S MUTATE ...

I love StopDesign design ... their skin fits well on me i think … hmm… not so bad … let’s try some others really beautiful people … i hope those people don’t hate me for linking to their css … but they really all have great sites you should check out…

ok not everyone makes me look good ... so i can’t in all good conscience call this a “love child” ... that’s why it’s a mutation …

bookmarklet: css mutate

drag this bookmarklet to your browser … and you too can make mutations … or grab source below and put on your website … it’s allot of FUN !

da code

var doc = document;
var sty = doc.styleSheets;
var els = doc.getElementsByTagName('*');
var hed = doc.getElementsByTagName('head')[0];
//take out all the styles
for (i=0;i<sty.length;i++)  
for (i=0; i<els.length; i++) 
    void(els[i].style.cssText = '');	
//new style
if(who == undefined || who == '') 
	who="default cs";	
	who=prompt('css stylesheet',who);
//create new link tag
var lnk = doc.createElement("link");
//set new style
//insert into head

download: css-mutate.js

some info

First thanks to David Dorward for the code to remove styles on a website …

so this is no where as sophisticated as man in blue, that actually parses the HTML to figure out the css files … but this requires no server side code … try the bookmarklet below by adding to yout browser bar … and try on any site …

try the bookmarklet for yourself on here and elsewhere

css mutate


There really is none … this was for fun … but maybe there is a need for standards across how we code … that maybe a little too much to ask … everyone has there “style” ...



Site has been moved

nuff-respec.com is no longer being updated. Please head over to dbulli.com for new content