1
Funny Inspect Element!
xenolovegood
craftykids
Put your funny inspect element pictures here!
Create an account or sign in to comment.
33
1
This is sort of complicated, but I made this and wanted to share it:
1. Right-click on some text and select "Inspect element"
2. Find the highlighted line of code, and then...
3. Type
4. Switch to the "Console" tab
5. Paste this in: [code]var blackRed = ["#000000","#ff0000"]; var gold = ["#685510","#997E21","#CDB64B","#EEE26A","#E5D760","#C3A93D","#AB912C","#D1BB4C","#D1BC4A","#A78929"]; var rainbow = ["#FF0000", "#FFFF00", "#00FF00", "#00FFFF", "#0000FF", "#FF00FF"]; function rotate(array) { array.splice(0,0,array[array.length-1]); array.pop(); } var interval; function gradient(colors, time, length) { if (colors == undefined) { colors = rainbow; } if (time == undefined) { time = 100; } if (length == undefined) { length = 18; } var gap = colors.length/length; var newColors = []; for (i = 0; i < length; i++) { var indexA = Math.floor(i*gap); var indexB = Math.ceil(i*gap); point = i*gap - indexA; function colorToArray(color) { return [parseInt(color.substr(1,2), 16), parseInt(color.substr(3,2), 16), parseInt(color.substr(5,2), 16)]; } function arrayToColor(array) { array = array.map(function(value){ if (value.toString(16).length == 1) {return "0" + value.toString(16)} else {return value.toString(16)}}); return "#" + array[0] + array[1] + array[2]; } var colorA = colorToArray(colors[indexA]); var colorB = colorToArray(colors[indexB%colors.length]); function segment(value, index) { return Math.round(value + point*(colorB[index] - value)); } newColors.push(arrayToColor(colorA.map(segment))); } colors = newColors; function gradientUpdate() { var gradients = document.getElementsByClassName("gradient"); for (i = 0; i < gradients.length; i++) { var nodes = gradients[i].childNodes; for (x = 0; x < nodes.length; x++) { if (nodes[x].nodeType == 3) { var nodeText = nodes[x].nodeValue; var newNode = document.createElement("div"); newNode.class = "gradientChars"; for (a = 0; a < nodeText.length; a++) { newNode.innerHTML += "<div style='display:inline; color:" + colors[(x+a)%colors.length] + ";'>" + nodeText.charAt(a) + "</div>"; } gradients[i].replaceChild(newNode, nodes[x]); } else if (nodes[x].class == "gradientChars") { for (k = 0; k < nodes[x].childNodes.length; k++) { nodes[x].childNodes[k].style.color = colors[k%colors.length]; } } } } rotate(colors); } stopGradient(); interval = setInterval(gradientUpdate,time); } function stopGradient() { clearInterval(interval); }[/code] and press enter
6. Type [code]gradient()[/code] and press enter
7. Watch the fancy colors
1. Right-click on some text and select "Inspect element"
2. Find the highlighted line of code, and then...
If you're using Chrome: Right-click that line of code and select "Add attribute"
If you're using Firefox: Double-click the first "greater than" symbol in that line of code
If you're using Firefox: Double-click the first "greater than" symbol in that line of code
3. Type
class="gradient" and press enter4. Switch to the "Console" tab
5. Paste this in: [code]var blackRed = ["#000000","#ff0000"]; var gold = ["#685510","#997E21","#CDB64B","#EEE26A","#E5D760","#C3A93D","#AB912C","#D1BB4C","#D1BC4A","#A78929"]; var rainbow = ["#FF0000", "#FFFF00", "#00FF00", "#00FFFF", "#0000FF", "#FF00FF"]; function rotate(array) { array.splice(0,0,array[array.length-1]); array.pop(); } var interval; function gradient(colors, time, length) { if (colors == undefined) { colors = rainbow; } if (time == undefined) { time = 100; } if (length == undefined) { length = 18; } var gap = colors.length/length; var newColors = []; for (i = 0; i < length; i++) { var indexA = Math.floor(i*gap); var indexB = Math.ceil(i*gap); point = i*gap - indexA; function colorToArray(color) { return [parseInt(color.substr(1,2), 16), parseInt(color.substr(3,2), 16), parseInt(color.substr(5,2), 16)]; } function arrayToColor(array) { array = array.map(function(value){ if (value.toString(16).length == 1) {return "0" + value.toString(16)} else {return value.toString(16)}}); return "#" + array[0] + array[1] + array[2]; } var colorA = colorToArray(colors[indexA]); var colorB = colorToArray(colors[indexB%colors.length]); function segment(value, index) { return Math.round(value + point*(colorB[index] - value)); } newColors.push(arrayToColor(colorA.map(segment))); } colors = newColors; function gradientUpdate() { var gradients = document.getElementsByClassName("gradient"); for (i = 0; i < gradients.length; i++) { var nodes = gradients[i].childNodes; for (x = 0; x < nodes.length; x++) { if (nodes[x].nodeType == 3) { var nodeText = nodes[x].nodeValue; var newNode = document.createElement("div"); newNode.class = "gradientChars"; for (a = 0; a < nodeText.length; a++) { newNode.innerHTML += "<div style='display:inline; color:" + colors[(x+a)%colors.length] + ";'>" + nodeText.charAt(a) + "</div>"; } gradients[i].replaceChild(newNode, nodes[x]); } else if (nodes[x].class == "gradientChars") { for (k = 0; k < nodes[x].childNodes.length; k++) { nodes[x].childNodes[k].style.color = colors[k%colors.length]; } } } } rotate(colors); } stopGradient(); interval = setInterval(gradientUpdate,time); } function stopGradient() { clearInterval(interval); }[/code] and press enter
6. Type [code]gradient()[/code] and press enter
7. Watch the fancy colors
1
I recommend viewing image in new tab.
1
Woody239Best "Inspect Element" Ever:
Step 1: Right click anywhere on the page.
Step 2: Select "Inspect Element"
Step 3: At the top right of the thing that pops up, go to the "Console" tabStep 4: Paste this into the console, and press enter.javascript:(function(){function c(){var e=document.createElement("link");e.setAttribute("type","text/css");e.setAttribute("rel","stylesheet");e.setAttribute("href",f);e.setAttribute("class",l);document.body.appendChild(e)}function h(){var e=document.getElementsByClassName(l);for(var t=0;t<e.length;t++){document.body.removeChild(e[t])}}function p(){var e=document.createElement("div");e.setAttribute("class",a);document.body.appendChild(e);setTimeout(function(){document.body.removeChild(e)},100)}function d(e){return{height:e.offsetHeight,width:e.offsetWidth}}function v(i){var s=d(i);return s.height>e&&s.height<n&&s.width>t&&s.width<r}function m(e){var t=e;var n=0;while(!!t){n+=t.offsetTop;t=t.offsetParent}return n}function g(){var e=document.documentElement;if(!!window.innerWidth){return window.innerHeight}else if(e&&!isNaN(e.clientHeight)){return e.clientHeight}return 0}function y(){if(window.pageYOffset){return window.pageYOffset}return Math.max(document.documentElement.scrollTop,document.body.scrollTop)}function E(e){var t=m(e);return t>=w&&t<=b+w}function S(){var e=document.createElement("audio");e.setAttribute("class",l);e.src=i;e.loop=false;e.addEventListener("canplay",function(){setTimeout(function(){x(k)},500);setTimeout(function(){N();p();for(var e=0;e<O.length;e++){T(O[e])}},15500)},true);e.addEventListener("ended",function(){N();h()},true);e.innerHTML=" <p>If you are reading this, it is because your browser does not support the audio element. We recommend that you get a new browser.</p> <p>";document.body.appendChild(e);e.play()}function x(e){e.className+=" "+s+" "+o}function T(e){e.className+=" "+s+" "+u[Math.floor(Math.random()*u.length)]}function N(){var e=document.getElementsByClassName(s);var t=new RegExp("\\b"+s+"\\b");for(var n=0;n<e.length;){e[n].className=e[n].className.replace(t,"")}}var e=30;var t=30;var n=350;var r=350;var i="//s3.amazonaws.com/moovweb-marketing/playground/harlem-shake.mp3";var s="mw-harlem_shake_me";var o="im_first";var u=["im_drunk","im_baked","im_trippin","im_blown"];var a="mw-strobe_light";var f="//s3.amazonaws.com/moovweb-marketing/playground/harlem-shake-style.css";var l="mw_added_css";var b=g();var w=y();var C=document.getElementsByTagName("*");var k=null;for(var L=0;L<C.length;L++){var A=C[L];if(v(A)){if(E(A)){k=A;break}}}if(A===null){console.warn("Could not find a node of the right size. Please try a different page.");return}c();S();var O=[];for(var L=0;L<C.length;L++){var A=C[L];if(v(A)){O.push(A)}}})()
Step 5: Close the "Inspect element" thing.
Step 6: Do it...
1
This is my only one:
1
Bumpity
1
Z645Sir CobaltClick to reveal
View in another taaab
is there a way to make images fit?
Use simg tags instead of img.[simg]http://i.imgur.com/iQsZVSd.png[/simg][simg]http://i.imgur.com/8PaDZMM.png[/simg]
Thanks
1
Sir CobaltClick to reveal
View in another taaab
is there a way to make images fit?
Use simg tags instead of img.
[simg]http://i.imgur.com/iQsZVSd.png[/simg][simg]http://i.imgur.com/8PaDZMM.png[/simg]1
is there a way to make images fit?
1
1
Really woody, Nice coding
1
Which one? Lol, I made the Paril one, but I found the Harlem Shake one online quite a long time ago. I just saved it as a note, to use at the right time...
1
Was talking about the
HARLEM SHAKE
HARLEM SHAKE
1
Woody239i.imgur.com/S1u9D7M.png
He's watching us....
"Became Parils slave" LOL
1
Ill make one
Brb making one!
Brb making one!
1
omg woody, pls
LOL this was hilarious...my dad walks in and sees this and i just am staring at the screen with the harlem shake blaring...pls
LOL this was hilarious...my dad walks in and sees this and i just am staring at the screen with the harlem shake blaring...pls
1
Best "Inspect Element" Ever:
Step 1: Right click anywhere on the page.
Step 2: Select "Inspect Element"
Step 3: At the top right of the thing that pops up, go to the "Console" tab
Step 5: Close the "Inspect element" thing.
Step 6: Do it...
Step 1: Right click anywhere on the page.
Step 2: Select "Inspect Element"
Step 3: At the top right of the thing that pops up, go to the "Console" tab
Step 4: Paste this into the console, and press enter.
javascript:(function(){function c(){var e=document.createElement("link");e.setAttribute("type","text/css");e.setAttribute("rel","stylesheet");e.setAttribute("href",f);e.setAttribute("class",l);document.body.appendChild(e)}function h(){var e=document.getElementsByClassName(l);for(var t=0;t<e.length;t++){document.body.removeChild(e[t])}}function p(){var e=document.createElement("div");e.setAttribute("class",a);document.body.appendChild(e);setTimeout(function(){document.body.removeChild(e)},100)}function d(e){return{height:e.offsetHeight,width:e.offsetWidth}}function v(i){var s=d(i);return s.height>e&&s.height<n&&s.width>t&&s.width<r}function m(e){var t=e;var n=0;while(!!t){n+=t.offsetTop;t=t.offsetParent}return n}function g(){var e=document.documentElement;if(!!window.innerWidth){return window.innerHeight}else if(e&&!isNaN(e.clientHeight)){return e.clientHeight}return 0}function y(){if(window.pageYOffset){return window.pageYOffset}return Math.max(document.documentElement.scrollTop,document.body.scrollTop)}function E(e){var t=m(e);return t>=w&&t<=b+w}function S(){var e=document.createElement("audio");e.setAttribute("class",l);e.src=i;e.loop=false;e.addEventListener("canplay",function(){setTimeout(function(){x(k)},500);setTimeout(function(){N();p();for(var e=0;e<O.length;e++){T(O[e])}},15500)},true);e.addEventListener("ended",function(){N();h()},true);e.innerHTML=" <p>If you are reading this, it is because your browser does not support the audio element. We recommend that you get a new browser.</p> <p>";document.body.appendChild(e);e.play()}function x(e){e.className+=" "+s+" "+o}function T(e){e.className+=" "+s+" "+u[Math.floor(Math.random()*u.length)]}function N(){var e=document.getElementsByClassName(s);var t=new RegExp("\\b"+s+"\\b");for(var n=0;n<e.length;){e[n].className=e[n].className.replace(t,"")}}var e=30;var t=30;var n=350;var r=350;var i="//s3.amazonaws.com/moovweb-marketing/playground/harlem-shake.mp3";var s="mw-harlem_shake_me";var o="im_first";var u=["im_drunk","im_baked","im_trippin","im_blown"];var a="mw-strobe_light";var f="//s3.amazonaws.com/moovweb-marketing/playground/harlem-shake-style.css";var l="mw_added_css";var b=g();var w=y();var C=document.getElementsByTagName("*");var k=null;for(var L=0;L<C.length;L++){var A=C[L];if(v(A)){if(E(A)){k=A;break}}}if(A===null){console.warn("Could not find a node of the right size. Please try a different page.");return}c();S();var O=[];for(var L=0;L<C.length;L++){var A=C[L];if(v(A)){O.push(A)}}})()
Step 5: Close the "Inspect element" thing.
Step 6: Do it...
1
1
Click to reveal
Better Beginnings Mod
(not making fun of it, actually I think it's a rather nice concept)
1
hey guys you can also use
javascript:document.body.contentEditable='true'; document.designMode='on'; void 0
javascript:document.body.contentEditable='true'; document.designMode='on'; void 0
1
I didn't even know you could do this...
1
Sir CobaltEnder_Armyhttp://prntscr.com/4gp0gn
and
http://prntscr.com/4gp0gn
They're the same thing
oh whoops lol, lemme fix that
*EDIT* Fixed. :3
1
1
1
Click to reveal
Again, view in new tab
1
Well, I got bored I was going to do the whole string of comments but cba.
http://imgur.com/WPwxUcS
http://imgur.com/dVPFiQc
http://imgur.com/WPwxUcS
http://imgur.com/dVPFiQc
1
Click to reveal
Best if viewed in another tab
1
1
Also, thanks for making me figure out how to mess things up with inspect element
1
1
bump
1
This was one Woody did of me:
1
Yaaay. I'm there
1
here's mine
