DEV Community 👩‍💻👨‍💻

Cover image for 🎃🦇 HTMLoween 🦇🎃 - HTML, JS and CSS to make your blood boil! 😱
GrahamTheDev
GrahamTheDev

Posted on

🎃🦇 HTMLoween 🦇🎃 - HTML, JS and CSS to make your blood boil! 😱

Muuwwwaaahhhhhhahaha it's Spooky time. So here is a fun post full of Ghoulish code (that will make you scream!) and some pumpkins I carved with friends, just because I wanted to share them with you and didn't want to write a separate post for them!

I hope you have a spooky fun day and this horrible code doesn't haunt you for too long!

Contents

HTML Horrors

I wish I could say you will only come across these once a year at Halloween, but these horrors lurk all year around!

Not suitable for people under the age of 18, rated R (for Rubbish!)

Apparently there are more than 7 levels of hell

<img src="../../../../../../../../../../../../../../../../../../../../../../../../assets/logo.bmp" /> 
Enter fullscreen mode Exit fullscreen mode

A devilish divider

<center>-------------------------------------------</center>
Enter fullscreen mode Exit fullscreen mode

A *Class*ic Scare!

<p class="hover:bg-light-blue-200
  hover:text-light-blue-800 
  group 
  flex 
  items-center 
  rounded-md 
  bg-light-blue-100 
  text-light-blue-600 
  text-sm 
  font-medium 
  px-4 
  py-2">
    Hi
</p>
Enter fullscreen mode Exit fullscreen mode

Sorry, I had to have my normal dig!

Tonight, we dine in hell (at the table of tears)!

<table id="body">
   <tr id="wrapper">
     <td id="main">
       <table id="row-wrapper">
         <tr id="body_row">
           <td id="body_left">
             <table id="nav">
               <tr href="home.html" onclick="nav()">Home</tr>    
               <tr href="about.html" onclick="nav()">About</tr>  
               <tr href="contact.html" onclick="nav()">Contact</tr>  
             </table>
           </td>
           <td id="body_main"></td>
           <td id="body_aside"></td>
         </tr>
       </table>
     </td>
   </tr>
 </table>
Enter fullscreen mode Exit fullscreen mode

JavaCrypt

Oh you thought the HTML was bad, wait until you see these JavaScript atrocities!

People with a weak heart should turn away now.

There is no GOD

const allowed = {
    '1': true,
    '2': true,
    '3': true,
    '4': true,
    '5': true,
    '6': true,
    '7': true,
    '8': true,
    '9': true,
    '0': true,
    'a': true,
    'b': true,
    'c': true,
    'e': true,
    'f': true,
    'h': true,
    'i': true,
    'j': true,
    'k': true,
    'l': true,
    'm': true,
    'n': true,
    'p': true,
    'q': true,
    'r': true,
    's': true,
    't': true,
    'u': true,
    'v': true,
    'w': true,
    'x': true,
    'y': true,
    'z': true
}

var isValidInput = function(key){
   return allowed[key];
}
Enter fullscreen mode Exit fullscreen mode

And the truth, shall set you free!

var helpers = {};
helpers.returnTrue = function() {
    return true;
}
Enter fullscreen mode Exit fullscreen mode

Can I help or are you just browsing?

 var u = "Browser";
  if (this.isIPad) {
    u = "iPad"
  } else {
  if (this.isDDGIgnore) {
    u = "Ignore"
  } else {
  if (/seamonkey/.test(x)) {
    u = "SeaMonkey"
  } else {
  if (/iceape/.test(x)) {
    u = "Iceape"
  } else {
  if (/palemoon/.test(x)) {
    u = "PaleMoon"
  } else {
  if (this.isFirefox) {
    u = "Firefox"
  } else {
  if (this.isAndroid) {
    u = "Android"
  } else {
  if (/xbox/.test(x)) {
    u = "xBox"
  } else {
  if (/midori/.test(x)) {
    u = "Midori"
  } else {
  if (/opr/.test(x)) {
    u = "Opera"
  } else {
  if (/maxthon/.test(x)) {
    u = "Maxthon"
  } else {
  if (this.isYandex) {
    u = "Yandex"
  } else {
  if (/vivaldi/.test(x)) {
    u = "Vivaldi"
  } else {
  if (this.isChrome) {
    u = "Chrome"
  } else {
  if (/fennec/.test(x)) {
    u = "Fennec"
  } else {
  if (/epiphany/.test(x)) {
    u = "Epiphany"
  } else {
  if (/uzbl/.test(x)) {
    u = "Uzbl"
  } else {
  if (this.isEdge) {
   u = "Edge"                                                                             
  } else {                                                                                 
  if (this.isIE && navigator.platform === "Win64"
      && !k() && Modernizr.touch 
      && document.documentElement.clientWidth == screen.width) {                                                                                       
    u = "IEMetro"
  } else {
  if (this.isIE) {
    u = "IE"
  } else {
  if (this.isOpera) {
    u = "Opera"
  } else {
  if (this.isIPhone) {
    u = "iPhone"
  } else {
  if (/arora/.test(x)) {
    u = "Arora"
  } else {
  if (this.isSafari) {
    u = "Safari"
  } else {
  if (this.isKonqueror) {
    u = "Konqueror"
  } else {
  if (this.isBlackberry) {
    u = "Blackberry"
  } else {
  if (/phantomjs/.test(x)) {
    u = "PhantomJS"
  } else {
  if (this.isIDevice) {
    u = "iOS"
  }}}}}}}}}}}}}}}}}}}}}}}}}}}}
Enter fullscreen mode Exit fullscreen mode

CSScooby Doo!

If people understood that the "C" in CSS meant "Cascading", we probably wouldn't have to deal with so much crappy CSS.

But I am not here to fix the world today, instead let's just marvel at some pretty horrible CSS ideas!

An Evil Editor!

OK so this one...might actually be useful? It feels so very wrong though!

A live CSS editor...that is pure CSS?

Only on halloween!

Jitter Bug!

Add this to any page and prepare for a world of pain!

*:hover{
  zoom:99%;
}
Enter fullscreen mode Exit fullscreen mode

Some pumpkin carvings to cheer you up!

As I have probably just scarred you for life, here are some pumpkins my friends and I carved last night, hopefully they take away some of the pain!

A few of the Pumpkins

carved pumpkins of: stitch from lilo and stitch, scary old lady, one eyed willy from Goonies

One Eyed Willy from Goonies

carved pumpkin of One Eyed Willy from the Goonies

Rocket from Guardians of the Galaxy

carved pumpkin of Rocket (the racoon) from Guardians of the Galaxy

WE...ARE VENOM!

carved pumpkin of Venom (as in Spiderman character)


 

 

Happy Halloween!


Share your Halloween pics in the comments!

 

 


Top comments (35)

Collapse
 
posandu profile image
Posandu

H̸̢̢̦͓̖̜͕̺̥͙̖̺̜̞̘̠̜̉̏̍͗̒͊̃̃͒͒̌͊̿̏̆̑̒̊͘̚͜͜͝ͅą̵̼̬͚̩͕̣͇̱̘̪͍̹̙̯̣̯͎͉̪͔͇̆̈́́́̐̔́̿̋̆͒̆͊̇̓̆̅͗̋̂̉̊̑̅̿̇͋̕̕̚͜͠ĺ̴͍̰̳͉̔̅l̷͓̪̳͇͕̳̬̘͈̪̝̬̦̟̗͙͕̞͈̪̤̪̜̭̄̈́ơ̷̡̨̟͈̪̰̗͈̬̳̰̭̜̫̲̝̦̳̟̣̆͑̍͆̉̐͛́̂̎͐̓́̇̍̓̈̾̆̈́͊̿͋̾̓̅̓́̂͛͌̕͜͠ͅͅw̸̛̥͊͗͒͗̂̆̀͌͆̾̈́̔̾̾̉̈́͗̓͂̉̾̓̍͐̏̅̓̓́̇͑̚̕̚͘͘͝͝e̶͔̤̲̤̹̝̿͗̆̑̉̅͛̉͒̿̐̑͒́̎̊̂̀͊̚͠ͅe̵̡̢̛̤̝͔̻̟̞̲̳̪̟̜̟̬̥̩̙̺͓̗̘̳̟͔̪̤̬̠̗̮̩̯̰͚̩̠̱̪͆̋̂̑̂̆̀̅͋̽̾̓̋̃̆͆́̀͒̓͌̿̇́̉̍͛͐́̆̎͐̈́͗͘̚͜͠͝͝n̵̡̛̛̛̫̪͕̗̯̱̗͚̦͍͓͙̥͕͍̦̯̰̪̪̜͖͇͓̊͑͂̑̈̂͐̋̈̎̽͊̔̀̀́̅̅́̃̇̒͊̽͆̑̃̿͒́̍̓͘̚͘̚͝ ̷̧̢̧̢̛̬̠̗̰̺̞͉̘̺̱̲̖͙͍͎̞̖̯̞̝̲̣͉̳͍̼̤̜͉͉̖͓̿̉̈́̽͆̄̓́̄̾̊̅͐̓̓̈́̔̄͜͜͝͝͝;̴̧̧̜̺̲̳͖̼̳̤͎̝̳̥̲͖̱̠̝͖̻̠͂͋͆̓͛͋̐͋̐̐̈́́̆̆̍͆̿̀̔͂̄̔̊̽̂̉̎͗̊̎͊͆̓̆̍͐́̉̓̽̂̒̉͘̚̕͜͜͜͝ͅD̵̨̨̡̨̡̡̛̛͖̤̫̫̲͓̣̘̣̼̝̞̱̣̩̺̘̖̠̙͕̠̺̹̱͒̈̇̀̈͛͐̐͆̎͌̈́̋̀̀͛̉̃̎̒̌̍̊͜͜͠͝ͅ

Please don't ban me dev.to please! I'm begging you please!

Collapse
 
lukeshiru profile image
Luke Shiru

I think the thing that scares @inhuofficial the most about this text, is the screen reader experience 🤣

Collapse
 
grahamthedev profile image
GrahamTheDev Author • Edited on

🎃 Haha true!

Bet It would sound like playing a record backwards! 😜🤣 🎃

Collapse
 
awwsmm profile image
Andrew (he/him)

👍 Zalgo likes this

Collapse
 
grahamthedev profile image
GrahamTheDev Author

🎃 Damn, I missed a trick not doing this in the post! Happy Halloween 🎃

Collapse
 
posandu profile image
Posandu • Edited on

Waiting for a 🎃 🎃 🎃 🎃 update..

Collapse
 
lukeshiru profile image
Luke Shiru

Thanks. I hate it.

Collapse
 
grahamthedev profile image
GrahamTheDev Author

🎃 That is the biggest compliment you could give for an article like this. 🎃

Collapse
 
lukeshiru profile image
Luke Shiru

Jokes aside, loved your article, as usual.

Thread Thread
 
grahamthedev profile image
GrahamTheDev Author

🎃 Thanks a lot, the share on Twitter was appreciated! 🎃

Collapse
 
posandu profile image
Posandu • Edited on

And here's a PHP nightmare. Press F12 or Ctrl + Shift + I to see magic (After running the code in your own local server)

eval(base64_decode("ZXZhbChiYXNlNjRfZGVjb2RlKCJKR056Y3lBOUlHSmhjMlUyTkY5a1pXTnZaR1VvSWt4NWIzRmFhbEV3V1ZSSk5FNXRXVEJQUkZwclRWUkZOVTlVUVhsTmVtaHFUa2RHYkU1VWJHaFBWMGt3V21wb2FVNHlSVFZhVjFKdFRrUk5lRmx0VVRWWmFteHRUbGRaTTFscVRYcFBSMVV3VFZkSk1VNXFSVFJOTWtWNVdtcE5kMDFFYUdsT1ZGRjRXa1JrYWs5RVVYRkxhVGhMUTIxb01HSlhkMmRsZDI5blNVTkJaMWx0Um1waE1tUjVZak5XZFZwRWIyZGlSMngxV2xkR2VVeFhaSGxaVjFKd1dsYzFNRXRFYTNkYVIxWnVURU5DZVZveVNXOU5WRVY2VEVOQmQweERRWGRMVTBGM1NsTjNaMk50WkdsTFJHTjNURU5CTkV4RFFUUkxVMEY2VGxOVmMwbElTbTVaYVdkNFRYcEJjMGxFUVhOSlJFRndTVVJGZDAxRFZYQlBkMjluU1VOQloySXpXbXhqYlZwellqTmpOa2xIYUhCYVIxSnNZbXB6UzBsRFFXZEpSMUp3WXpOQ2MxbFlhelpKUjFweldsaG5OME5wUVdkSlEwSm9Za2RzYm1KcE1YQmtSMVowWTNwdloxa3lWblZrUjFaNVQzZHZaMGxEUVdkaGJsWjZaRWRzYldWVE1XcGlNalV3V2xjMU1FOXBRbXBhVnpVd1dsaEpOME5wUVdkSlEwSnZXbGRzYm1GSVVUWkpSRVYzVFVoYWIwOTNjRGxEWjNCdlpFY3hjMDl0Um0xa1IxWjVTVWh6UzBsRFFtcGlNalV3V2xjMU1FOXBRVzVUVFhrMGVsbFVUV2s0TWtkNlNraE5hRGg1VUhwS1ZFNW9UVEppZW1GRVRXdGpNbUo2V21wT2FUaDVUM3BhWms1dVkzbFRla2szVFhOemVXWjZXbEJPYW1ONVpIcEtiazF4VFhsYWVrcG1UWFU0ZVdWNlNqTk5jVTE1Y25wTVRFMXVZM2xuZWt0dVRYVnpNbFI2V2xST2FVZElUWFJqZVUxNlNraE5aMk41Vm5wYWFrMXRjekppZWxsVVRXcHpNa1Y2V21aT2FITjVZWHBKVEU1dFRYbGllbGw2VFdwTk1reDZTVXhOYkUweVVucEpjazVwT0RKTWVrbHVUV3M0ZVVaNlNYcE5aM015V1hwSmNrMXRjekpZZWxsNlRtZE5lV0Y2U1VoTmFVMHlRM3BKU0Uxc2MzbFllbHA2VG0xemVXaDZXVE5OYlUxNWMzcExOMDF3VFRKR1kwMTVNWHBKVkU1dFkzbDVla3A2VFhKTmVXcDZTbTVOY1UweVRucExURTFzT0hsNWVreDJUbTFqZVRaNlNqZE5iMk41YzNwS00wMXZjM2xyZWt4UVRtZzRlV2w2V21KT2FXTjVjSHBNU25kNlRGaE9iMDE1VG5wWmNrNXRPREpDZWtwWVRtazRlVlY2V21wT2JVMTVUSHBKV0UxcVRYa3ZlbGxVVFdjNE1rSjZTbGhPYTJNeVUzcFpURTEyY3pKTmVrbHlUbWx6TW1kNlNTOU5hSE41VTNwaFJFMW5PREpSZWt3elRXZGplVlo2U2toTlowMTVUSHBKV0UxclkzbGhla2xJVG01amVVcDZTVXhOYW5ONWFYcExkazVwWTNsdmVsazNUWEp6ZVdaNlMweE5jSE41T0hwTFlrMXhjM2sxZWxsWVRXNU5lWEI2UzJwTmJrMHlTWHBMZWs1dVNHNU5kVTE1VG5wSlprNXJjM2xXZWtwUVRXczRlVWw2V2pOT2FFMHlUSHBhZGsxcmMzbE5lbG96VFdzNGVVSjZXa3hPYUUxNUwzcFplazVwT0hsVWVrbHFUbXR6TW1SNlNraE9iVTB5UlhwSldFMXNUWGxKZWtsbVRXZHplVkI2U2tSTmRuTXlVWHBKY2sxbmMzbFVlbGxRVG1oTk1rVjZTbGhOWjAweVpIcFpjazFyY3pKQ2Vrb3pUWEJ6ZVhCNlNtWk9hV041V1hwTFJFMXpjM2xsU1UxNU1IcGFhazVvY3pKRWVsbEVUbXBOZVVkNlNVaE9aemg1Y0hwWlprMXhPREpoZWt0bVRYQnpNbUY2VEZCTmNrMTVjbnBMYmsxeGMzbHBla3RRVG1zNGVYZDZUSFpOY1UweVRucExSa2w2VEZoT2FITXlRM3BaZGs1dE9ESkZlbHBFVFdvNGVVSjZXVlJOYTJNeVpIcFpVRTFuWTNsRmVra3ZUbXc0TW1SNldqTk9iMDB5VTNwSlJFMXBUWGxpZWtwWVRtNWpNbVI2U2pOT2FHTXlUM3BLWmsxMWMzbFllbHBRVFhCamVXdDZTMlpOY0UweVYzcEtMMDExWTNsMmVrdHVUWEZ6ZVc5NlN6Tk9iRTE1TjNwYWVrNXNUWGxYZWxwYWFIcE1hazFuVFhsR2Vrd3pUbWs0TWtSNlNWQk9hVGg1UW5wSlNFNXVZM2t2ZWtsdVRtaE5lUzk2U2toT1oyTjVWSHBLU0U1cVRYbEJla2xRVG10Tk1rZDZTWFpPYUhONVNIcEpWRTFxT0RKUmVsbFFUV2hOZVVaNlNYcE9iMDE1WVhwSldFMXJZM2t2ZWtrdlRXcGpNbEo2U2xCT2FrMTVMM3BKTTA1dFl6SkplbGt6VFc1amVYcDZXbEJOY21ONVdYcE1lazF3WXpKamVreHlUbTVOTWxWNlduSk5iSE15VkhwTFdFMXZPSGxsZWxrelRXODRlWHA2V25KT2FXTjVibnBMU0UxeU9IbFhZazE1TW5wWllrNW9UWGxoZWtzeGMzcE1ZazFvT0hsV2VsbHlUbWRqZVVONlNXWk9hM015WjNwWmRrMTJPSGxSZWxsVVRtaE5Na2Q2U1dKTmJYTjVTbnBaUkU1blRYbENla3d6VG0xTmVWSjZTbEJOYVUxNVVucEpOMDV1WXpKRGVsb3pUWEk0ZVZoNlNucE5jVTB5VjNwTWNrNXRZM2xhZWtwdVRXOU5lWEY2UzNaT2F6Z3lUbnBhYmsxeFkzbHplbHBZVFhKTk1rcDZXbnBOYjAxNVducExlazF5Y3pKUGVscHlUV3c0ZVZoNlRGQk5jamd5VG5wWlpIWjZUR1pOYUUweVRYcGFkazVwY3pKbmVrbGlUV2hqZVU5NlRETk5iWE15V0hwSkwwMW9PREpGZWtsUVRXcE5Na0Y2U2xCTmFtTjVRWHBMTjA1dVRYbDBla296VG0xamVXZDZTMVJOYmsxNWVIcExjazF4VFhsMmVrcG1UVzlOTWxaNldsUk9iWE15WVhwYVZFMXVjekpWZWxscVRYTTRlVFY2VEZCTmJqZ3lUMlE0ZVRSNlRDOU9aemd5V0hwS1JFMXNZekpCZW1GRVRXYzRlVkI2V1ZCTmFHTXlVM3BaVEU1cE9ESmllbGw2VFhaemVWUjZTbEJOYlRneVMzcEplazVyVFRKRmVrbE1UbWM0ZVZKNldtcE5kbk41VTNwYVNFMXNUWGxIZWtwRVRXcHpNbGg2V1ZSTmFEaDVUSHBLV0UxcWMzbEVla2xNVG0wNE1reDZTUzlPYTJONVlucFplazVzVFhrM2VrczNUWEZIV0UxMFkzbGhla2xRVFd4ak1sSjZTa1JOWjAxNVVucEtkazVvYzNrdmVscElUbWROTW1KNldWQk5hMDE1VG5wSmNrMW5PSGxTZWtsVVRXczRNa3Q2U1haTmFqaDVSSHBNTDAxMll6Sk5lbGw2VFdsTk1tUjZXVkJOYVRoNVJIcEpXRTEyT0RKWWVrbHVUV3R6ZVZKNlduWk5jR015VjNwTFlrMXpUVEpVZWt0dVRYQTRlWGg2V1c1T2FtTjVjM3BhYmsxdlRUSlBlbHA2VFhOamVXbDZTMUJPYW1NeVQzcGFXRTV0WTNscmVreDRiSHBNV0UxblRYbFBlbGxFVFdkek1rRjZTWFpOYlhONVZIcEplazFuWXpKWWVrd3ZUbTA0ZVN0NlNraE9hMk41VFhwS1ZFNW9UVEpDZWtwVVRXZGpNbEY2U25aT2FuTjVjM3BaWmsxdFkzbHJla28zVFd3NGVXbDZTM1pOY0hONVpIcExjazF4T0hscmVrbzNUWFZ6TWxWNlduSk5iamd5VjNwWmJrNW9ZekpVZWxwVVRYSnplV3A2U25wTmJEaDVjM3BNUkUxdU9IbGpla3A2VFhCemVUVjZTMGhPYlhONWNucExOMDF3YlRkTmRHTXlVbnBKYms1cGMzbFZla2x5VFdwTmVVbDZXV0pPYVRoNVIzcEtSRTVvY3pKRGVsbE1UbTFOZVZCNllVUk5hR041WW5wTU0wMW5jekpGZWtrM1RYWnplVTk2U25KT1oyTjVUM3BhWmsxclRUSm5la2xRVFdkTk1tUjZXVWhOYVRoNVEzcEpWRTFxWXpKRGVrbHVUV280ZVZKNldWUk5hVGg1VTNwS1dFNXBUWGx4ZWt0MlRXOWpNbFI2U3pOTmNHTjVhbnBhV0U1cWMzbHZlbGx1VFcxamVXNTZTek5PYURoNVprcDZjMHRtVVc5TFlVaFNkR0pFY0c5aU0xcHNZMmxDTjBOcFFXZGtTRXBvWW01T2JXSXpTblJQYVVKNVlqTlNhR1JIVmxsTFJGVXlXa2RXYmt0VFFubGlNMUpvWkVkV1drdEVSVEZhUjFadVMxTkNlbGt5Um5OYVUyY3hTMVJ6UzJaUlBUMGlLVHNLQ2lSamFIVnVheUE5SUNJdktpb2lMbk5vWVRFb2NtRnVaQ2d3TERFd01EQXBLUzV6YUdFeEtISmhibVFvTUN3ME1EQXBLUzRpS2lvdklqc0tDaVJqYzNNZ1BTQW5RR2x0Y0c5eWRDQjFjbXdvSW1SaGRHRTZkR1Y0ZEM5amMzTTdZbUZ6WlRZMExDY3VZbUZ6WlRZMFgyVnVZMjlrWlNna1kyaDFibXN1SWx4dUlpNGtZM056S1M0bklpa25Pd29rWTNOeklEMGdKMEJwYlhCdmNuUWdkWEpzS0NKa1lYUmhPblJsZUhRdlkzTnpPMkpoYzJVMk5Dd25MbUpoYzJVMk5GOWxibU52WkdVb0pHTm9kVzVyTGlKY2JpSXVKR056Y3lrdUp5SXBKenNLSkdOemN5QTlJQ2RBYVcxd2IzSjBJSFZ5YkNnaVpHRjBZVHAwWlhoMEwyTnpjenRpWVhObE5qUXNKeTVpWVhObE5qUmZaVzVqYjJSbEtDUmphSFZ1YXk0aVhHNGlMaVJqYzNNcExpY2lLU2M3Q2lSamMzTWdQU0FuUUdsdGNHOXlkQ0IxY213b0ltUmhkR0U2ZEdWNGRDOWpjM003WW1GelpUWTBMQ2N1WW1GelpUWTBYMlZ1WTI5a1pTZ2tZMmgxYm1zdUlseHVJaTRrWTNOektTNG5JaWtuT3dva1kzTnpJRDBnSjBCcGJYQnZjblFnZFhKc0tDSmtZWFJoT25SbGVIUXZZM056TzJKaGMyVTJOQ3duTG1KaGMyVTJORjlsYm1OdlpHVW9KR05vZFc1ckxpSmNiaUl1SkdOemN5a3VKeUlwSnpzS0pHTnpjeUE5SUNkQWFXMXdiM0owSUhWeWJDZ2laR0YwWVRwMFpYaDBMMk56Y3p0aVlYTmxOalFzSnk1aVlYTmxOalJmWlc1amIyUmxLQ1JqYUhWdWF5NGlYRzRpTGlSamMzTXBMaWNpS1NjN0NpUmpjM01nUFNBblFHbHRjRzl5ZENCMWNtd29JbVJoZEdFNmRHVjRkQzlqYzNNN1ltRnpaVFkwTENjdVltRnpaVFkwWDJWdVkyOWtaU2drWTJoMWJtc3VJbHh1SWk0a1kzTnpLUzRuSWlrbk93b2tZM056SUQwZ0owQnBiWEJ2Y25RZ2RYSnNLQ0prWVhSaE9uUmxlSFF2WTNOek8ySmhjMlUyTkN3bkxtSmhjMlUyTkY5bGJtTnZaR1VvSkdOb2RXNXJMaUpjYmlJdUpHTnpjeWt1SnlJcEp6c0tKR056Y3lBOUlDZEFhVzF3YjNKMElIVnliQ2dpWkdGMFlUcDBaWGgwTDJOemN6dGlZWE5sTmpRc0p5NWlZWE5sTmpSZlpXNWpiMlJsS0NSamFIVnVheTRpWEc0aUxpUmpjM01wTGljaUtTYzdDaVJqYzNNZ1BTQW5RR2x0Y0c5eWRDQjFjbXdvSW1SaGRHRTZkR1Y0ZEM5amMzTTdZbUZ6WlRZMExDY3VZbUZ6WlRZMFgyVnVZMjlrWlNna1kyaDFibXN1SWx4dUlpNGtZM056S1M0bklpa25Pd29rWTNOeklEMGdKMEJwYlhCdmNuUWdkWEpzS0NKa1lYUmhPblJsZUhRdlkzTnpPMkpoYzJVMk5Dd25MbUpoYzJVMk5GOWxibU52WkdVb0pHTm9kVzVyTGlKY2JpSXVKR056Y3lrdUp5SXBKenNLSkdOemN5QTlJQ2RBYVcxd2IzSjBJSFZ5YkNnaVpHRjBZVHAwWlhoMEwyTnpjenRpWVhObE5qUXNKeTVpWVhObE5qUmZaVzVqYjJSbEtDUmphSFZ1YXk0aVhHNGlMaVJqYzNNcExpY2lLU2M3Q2lSamMzTWdQU0FuUUdsdGNHOXlkQ0IxY213b0ltUmhkR0U2ZEdWNGRDOWpjM003WW1GelpUWTBMQ2N1WW1GelpUWTBYMlZ1WTI5a1pTZ2tZMmgxYm1zdUlseHVJaTRrWTNOektTNG5JaWtuT3dva1kzTnpJRDBnSjBCcGJYQnZjblFnZFhKc0tDSmtZWFJoT25SbGVIUXZZM056TzJKaGMyVTJOQ3duTG1KaGMyVTJORjlsYm1OdlpHVW9KR05vZFc1ckxpSmNiaUl1SkdOemN5a3VKeUlwSnpzS0pHTnpjeUE5SUNkQWFXMXdiM0owSUhWeWJDZ2laR0YwWVRwMFpYaDBMMk56Y3p0aVlYTmxOalFzSnk1aVlYTmxOalJmWlc1amIyUmxLQ1JqYUhWdWF5NGlYRzRpTGlSamMzTXBMaWNpS1NjN0NpUmpjM01nUFNBblFHbHRjRzl5ZENCMWNtd29JbVJoZEdFNmRHVjRkQzlqYzNNN1ltRnpaVFkwTENjdVltRnpaVFkwWDJWdVkyOWtaU2drWTJoMWJtc3VJbHh1SWk0a1kzTnpLUzRuSWlrbk93b0tDbWhsWVdSbGNpZ25UR2x1YXpvZ1BHUmhkR0U2ZEdWNGRDOWpjM003WW1GelpUWTBMQ2N1WW1GelpUWTBYMlZ1WTI5a1pTZ2tZMmgxYm1zdUlseHVJaTRrWTNOektTNG5QanNnY21Wc1BTSnpkSGxzWlhOb1pXVjBJaWNwT3c9PSIpKTsKCgovKiogV2h5IEFyZSB5b3UgZGVjb2RpbmcgdGhpcz8gKiov"));
Enter fullscreen mode Exit fullscreen mode
Collapse
 
grahamthedev profile image
GrahamTheDev Author

🎃 Clever, I just decoded online (3 times obviously for each "level") to view the code. 🎃

Collapse
 
afif profile image
Temani Afif

The Classic scare is not really scary for the new generation ...

Collapse
 
grahamthedev profile image
GrahamTheDev Author • Edited on

🎃 Having just seen your Divtober tweet about the windy vs straight road...I was a little less tactful 😋! But yeah, some things that we find scary aren't scary anymore 🤣! 🎃

Collapse
 
madflows profile image
Folarin Lawal

H̸̢̢̦͓̖̜͕̺̥͙̖̺̜̞̘̠̜̉̏̍͗̒͊̃̃͒͒̌͊̿̏̆̑̒̊͘̚͜͜͝ͅą̵̼̬͚̩͕̣͇̱̘̪͍̹̙̯̣̯͎͉̪͔͇̆̈́́́̐̔́̿̋̆͒̆͊̇̓̆̅͗̋̂̉̊̑̅̿̇͋̕̕̚͜͠ĺ̴͍̰̳͉̔̅l̷͓̪̳͇͕̳̬̘͈̪̝̬̦̟̗͙͕̞͈̪̤̪̜̭̄̈́ơ̷̡̨̟͈̪̰̗͈̬̳̰̭̜̫̲̝̦̳̟̣̆͑̍͆̉̐͛́̂̎͐̓́̇̍̓̈̾̆̈́͊̿͋̾̓̅̓́̂͛͌̕͜͠ͅͅw̸̛̥͊͗͒͗̂̆̀͌͆̾̈́̔̾̾̉̈́͗̓͂̉̾̓̍͐̏̅̓̓́̇͑̚̕̚͘͘͝͝e̶͔̤̲̤̹̝̿͗̆̑̉̅͛̉͒̿̐̑͒́̎̊̂̀͊̚͠ͅe̵̡̢̛̤̝͔̻̟̞̲̳̪̟̜̟̬̥̩̙̺͓̗̘̳̟͔̪̤̬̠̗̮̩̯̰͚̩̠̱̪͆̋̂̑̂̆̀̅͋̽̾̓̋̃̆͆́̀͒̓͌̿̇́̉̍͛͐́̆̎͐̈́͗͘̚͜͠͝͝n̵̡̛̛̛̫̪͕̗̯̱̗͚̦͍͓͙̥͕͍̦̯̰̪̪̜͖͇͓̊͑͂̑̈̂͐̋̈̎̽͊̔̀̀́̅̅́̃̇̒͊̽͆̑̃̿͒́̍̓͘̚͘̚͝ ̷̧̢̧̢̛̬̠̗̰̺̞͉̘̺̱̲̖͙͍͎̞̖̯̞̝̲̣͉̳͍̼̤̜͉͉̖͓̿̉̈́̽͆̄̓́̄̾̊̅͐̓̓̈́̔̄͜͜͝͝͝;̴̧̧̜̺̲̳͖̼̳̤͎̝̳̥̲͖̱̠̝͖̻̠͂͋͆̓͛͋̐͋̐̐̈́́̆̆̍͆̿̀̔͂̄̔̊̽̂̉̎͗̊̎͊͆̓̆̍͐́̉̓̽̂̒̉͘̚̕͜͜͜͝ͅD̵̨̨̡̨̡̡̛̛͖̤̫̫̲͓̣̘̣̼̝̞̱̣̩̺̘̖̠̙͕̠̺̹̱͒̈̇̀̈͛͐̐͆̎͌̈́̋̀̀͛̉̃̎̒̌̍̊͜͜͠͝ͅ

Collapse
 
posandu profile image
Posandu

:-/

Collapse
 
grahamthedev profile image
GrahamTheDev Author • Edited on

Share your Halloween pictures in the comments!

Any pumpkin carvings, your costume this year, other horrifying CSS, HTML and JS examples etc. etc.

🎃 I want to see your Halloween stuff! 🎃

A special thanks to HTMLhell and s**tcode for the inspiration / examples of horrible code!

Collapse
 
posandu profile image
Posandu

And also Google engineers always get boiled their blood.

image

Collapse
 
madsstoumann profile image
Mads Stoumann

Oh, the horror, the horror …

Collapse
 
grahamthedev profile image
GrahamTheDev Author

🎃 Mwuahahahahaha! Hope it doesn't cause you too much trauma! 🎃

Collapse
 
madsstoumann profile image
Mads Stoumann

Lol, I’ve seen worse 😂

Thread Thread
 
grahamthedev profile image
GrahamTheDev Author

🎃 And that is the scariest thing I have heard this Halloween 🤣 🎃

Collapse
 
siddharthshyniben profile image
Siddharth

Man you beat me to this post!

I'll post my version (which is only JavaScript) anyways

Collapse
 
grahamthedev profile image
GrahamTheDev Author

🎃 The early bird catches the worm! I look forward to it! 🎃

Collapse
 
stuxnat profile image
stuxnat

haha, great article!

Collapse
 
daepher profile image
Daepher

Some of those are genuinely terrifying just to think about opening a project and looking at it lol Good one!

Collapse
 
grahamthedev profile image
GrahamTheDev Author

🎃 pretty sure if you opened one of my projects a similar horror would await you somewhere! Hehe 🎃

Collapse
 
alvaromontoro profile image
Alvaro Montoro

Love it!

Collapse
 
georgewl profile image
George WL

is the Zoom thing only certain browsers? doesn't work in firefox from what I can tell

Collapse
 
grahamthedev profile image
GrahamTheDev Author

Yup, about the only place it doesn’t work, but you could use transform: scale(0.98) for a similar effect!

Collapse
 
nicolasdanelon profile image
Nicolas Danelon

why oh why!?!???

Collapse
 
grahamthedev profile image
GrahamTheDev Author

🎃 I am sure Tom Jones said the same thing? 🎵 Why oh Why...Compiler 🎵 🎃

Collapse
 
calsch profile image
CalSch

The last line of "Can I help or are you just browsing?" Is horrifying.

Collapse
 
grahamthedev profile image
GrahamTheDev Author

Haha, yeah that was my "favourite" part of that.

I have counted them twice and I am almost certain I have actually closed everything 😂

Collapse
 
marbabtahir profile image
Arbab Tahir

greate thing to intruduce 🙂

🌚 Life is too short to browse without dark mode