Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
Glitch website using jQuery
$.fn.glitchMode = function() {
var glitches = {
/**
* Random color
*/
color: function(e) {
var color ='#'+Math.random().toString(16).substr(2,6);
e.css('color', color );
},
/**
* Random scale
*/
scale: function(e) {
var scale = 'scale3d(' + Math.floor((Math.random() * 3) + 1) + ',' + Math.floor((Math.random() * 3) + 1) + ',' + Math.floor((Math.random() * 3) + 1) + ')';
e.css('transform', scale);
},
/**
* Rotate
*/
rotate: function(e) {
var rotate = 'rotate(' + Math.floor((Math.random() * 30) + 1) + 'deg)';
e.css('transform', rotate);
},
/**
* Random bg color
*/
bgColor: function(e) {
var color ='#'+Math.random().toString(16).substr(2,6);
e.css('background-color', color );
},
};
var keys = Object.keys(glitches);
// Loop through all elements
$('body > *')
.each( function() {
var r = Math.floor((Math.random() * 100) + 1);
var $this = $(this);
var threshold = Math.floor((Math.random() * 10) + 1);
for(var i=0; i<threshold; i++) {
glitches[keys[ keys.length * Math.random() << 0]]($this);
}
});
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment