DEV Community 👩‍💻👨‍💻

Cover image for console.fun() or how to mess up the DOM
jan paul
jan paul

Posted on

console.fun() or how to mess up the DOM

I stumbled upon this little gem in the vue-land #random channel and it made me smile. Posted by xan#2554.

Thought maybe it can make you smile too and decided to share it to you. Have fun.

Instructions

  1. copy script
  2. visit your most preferred website -- ..most likely dev.to 😜
  3. open console
  4. paste script and press enter
(function funnyFunction() {
  var screenwidth = window.innerWidth;
  var screenheight = window.innerHeight;
  document.querySelectorAll('body *').forEach(function(node) {
    randT = Math.floor(Math.random() * screenheight);
    randL = Math.floor(Math.random() * screenwidth);
    node.setAttribute('style', 'transition-duration:500ms; transition-property: left, top; position: fixed; top:'+randT+'px; left:'+randL+'px');
  });
  setInterval(funnyFunction, 500);
})();
Enter fullscreen mode Exit fullscreen mode

Be honest to yourself, did you knew what will happen?

cheers

Top comments (0)

In defense of the modern web

I expect I'll annoy everyone with this post: the anti-JavaScript crusaders, justly aghast at how much of the stuff we slather onto modern websites; the people arguing the web is a broken platform for interactive applications anyway and we should start over;

React users; the old guard with their artisanal JS and hand authored HTML; and Tom MacWright, someone I've admired from afar since I first became aware of his work on Mapbox many years ago. But I guess that's the price of having opinions.