Home > jquery > Cornify Konami easter egg plugin with jQuery

Cornify Konami easter egg plugin with jQuery

February 4th, 2009

No doubt you've heard that Cornifying is the latest and greatest invention of the internet.

Now you can surreptitiously add it to your own sites, joining The Underground Cabal of Mirthful Protectors of the Corn:

var kkeys = [], konami = "38,38,40,40,37,39,37,39,66,65";
$(document).keydown(function(e) {
  kkeys.push( e.keyCode );
  if ( kkeys.toString().indexOf( konami ) >= 0 ){
    $(document).unbind('keydown',arguments.callee);
    $.getScript('http://www.cornify.com/js/cornify.js',function(){
      cornify_add();
      $(document).keydown(cornify_add);
    });          
  }
});

After a user hits the Konami code (up,up,down,down,left,right,left,right,b,a), every other keystroke will add happiness to the world.

You'll find this website has already been enabled. Try it out. :)

Update 2009.04.27: It was discovered today ESPN.com was hiding some unicorns under its konami. (kotaku coverage) In fact it had been up there for weeks. :)

2010.05.29: BoingBoing will probably add it. And yeah this feature kinda triggered a meme. :p

2012.03.22: Gunnar Hoffman wrote a better implementation: http://paulirish.com/2009/cornify-easter-egg-with-jquery/#comment-68011

jquery

  1. February 4th, 2009 at 13:38 #1

    LOL. That is awesome.

  2. February 4th, 2009 at 13:39 #2

    This is hilarious – the most useful thing I've read in a long time!

  3. February 5th, 2009 at 01:59 #3

    HAHA! That's the best thing I've seen all week.

  4. February 6th, 2009 at 09:30 #4

    Best. Friday. post. ever.
    This made my day.

  5. Adam
    February 7th, 2009 at 12:17 #5

    That is so completely useless that I love it.

  6. February 20th, 2009 at 21:16 #6

    I love it!

  7. April 4th, 2009 at 21:11 #7

    Awesome! I'm going to have to memorize the secret key sequence XD

  8. Alex
    April 27th, 2009 at 18:12 #8

    The problem with this code is that when I hit b and a in Safari 4, it automatically brings up the search bar and it puts the b and a into the search and starts looking for all words on the page that start with "ba"

    And whatever this code is supposed to do, I have yet to see it in action…..Quite sad really :-(

  9. Bonnie
    April 27th, 2009 at 18:43 #9

    Where should the code be put in the site for it to work?

  10. April 27th, 2009 at 18:47 #10

    Bonnie, if you include jQuery,

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

    Then you can just do

    <script>
    jQuery(function($){
      // add the code from above
    });
    </script>
  11. ralph
    April 27th, 2009 at 18:51 #11

    yeah, can you get us a "how to install this code for dummies" version? i'd like to try it on my site.

  12. tim
    April 27th, 2009 at 19:19 #12

    how do you get the pictures on top of everything and not expand the page downwards? I'm trying to get it like the espn page.

  13. April 27th, 2009 at 19:39 #13

    Anyone know how to do it in PHPBB3?

  14. Phil
    April 27th, 2009 at 21:30 #14

    Tried this on my personal site (in the section in the index.html) as well as my vbulletin site (inside the index.php) and cant get it working. I also included the link #10 above showed, which I still cant get to work

  15. April 27th, 2009 at 23:13 #15

    hahaha! that's really cool. what's up with the weird domain names you're putting out? they area breaking my regex lol

  16. April 28th, 2009 at 01:02 #16

    Installed this on my web site but it only works if you first click inside the site with the mouse… some kind of focus issue?

  17. April 28th, 2009 at 04:12 #17

    So awesome it hurts! THANX!

  18. April 28th, 2009 at 15:03 #18

    That's pretty awesome. I released a similar piece of code at konami-js.googlecode.com. It's a slightly different approach, but it doesn't use jQuery or have any of the pretty unicorns and rainbows – but you can always add them!

  19. May 10th, 2009 at 08:20 #19

    @Alex
    Firefox does the same thing. You can go into Tools –> Settings and on the advanced tab, there is an option for turning off "find text when I start typing" or something similar.

  20. May 12th, 2009 at 14:53 #20

    Hey thanks that was awesome, I took the code and made some custom changes
    Thanks again

  21. May 22nd, 2009 at 05:52 #21

    Nice. But, How do i stop it?

  22. Kalebarkab
    June 9th, 2009 at 12:33 #22

    I want to find good pop music. Help me please.

  23. MJ
    December 28th, 2010 at 17:55 #23

    No unicorns, but check out the code on http://www.scribendi.com/news

  24. March 9th, 2011 at 12:55 #24

    This plugin/script doesn't work any more.

  25. March 23rd, 2011 at 12:55 #25

    How do you get the button to work? I copied it onto my blog, but when you click on it, it just goes to cornify.com. And can you explain the Konami code to me please. I like this website, and I was wondering how you got those thingies on the sides of your website that like scribble where ever your mouse goes. Sorry, I ask a lot of questions.. :)

  26. Gunnar Hoffman
    August 20th, 2011 at 19:45 #26

    I would like to suggest the following code because it will perform better over long periods of time if your users type many thousands of characters. It's memory footprint does not increase and has no string comparisons.

    var konami_keys = [38, 38, 40, 40, 37, 39, 37, 39, 66, 65];
    var konami_index = 0;
    $(document).keydown(function(e){
        if(e.keyCode === konami_keys[konami_index++]){
            if(konami_index === konami_keys.length){
                $(document).unbind('keydown', arguments.callee);
                $.getScript('http://www.cornify.com/js/cornify.js',function(){
                    cornify_add();
                    $(document).keydown(cornify_add);
                }); 
            }
        }else{
            konami_index = 0;
        }
    });
  27. August 27th, 2011 at 17:55 #27

    You know what's funny Paul, your snippet here is what I used to make the #plaidirish easter egg that's on the Isobar standards page, modified with diff script src and key codes. Adds to the awesomeness of the easter egg lol

  28. Software Engineer
    March 21st, 2012 at 22:38 #28

    @Gunnar Hoffman
    I'm glad /somebody/ knows what they're talking about. Paul's code is ridiculously inefficient for something so simple.

  29. March 22nd, 2012 at 09:23 #29

    @Gunnar Hoffman
    Thx gunnar. Certainly better.

    My original implementation stole code from Resig but this was all 3+ years ago. so yeah.. pretty bad. :)

  30. April 15th, 2012 at 07:10 #30

    Hello! I have a question concerning security: I’d like to build something similar (a collection of easter eggs / gimmicks for websites e.g. visitor counters, watches, scroll-o-meters etc.) as my thesis project in communication design.
    Aren’t there any security issues when fetching a script from a remote server like cornify does?
    There is much talk about security of JSONP but nowhere the words "cornify" and "security" appear together.

  1. April 27th, 2009 at 18:24 | #1
  2. April 27th, 2009 at 18:52 | #2
  3. April 28th, 2009 at 11:24 | #3
  4. April 28th, 2009 at 13:55 | #4
  5. April 30th, 2009 at 00:50 | #5
  6. May 1st, 2009 at 14:08 | #6
  7. May 3rd, 2009 at 20:59 | #7
  8. May 12th, 2009 at 00:31 | #8
  9. October 29th, 2009 at 03:12 | #9
  10. January 24th, 2010 at 19:37 | #10
  11. August 1st, 2010 at 13:37 | #11
  12. August 1st, 2010 at 21:53 | #12
  13. August 17th, 2011 at 16:27 | #13
  14. January 8th, 2012 at 07:47 | #14
  15. April 8th, 2012 at 13:57 | #15
  16. April 8th, 2012 at 13:58 | #16
  17. April 8th, 2012 at 13:58 | #17
  18. April 8th, 2012 at 18:58 | #18
  19. April 8th, 2012 at 22:20 | #19
  20. April 9th, 2012 at 00:07 | #20
  21. April 9th, 2012 at 01:33 | #21
  22. April 25th, 2012 at 03:45 | #22
  23. April 25th, 2012 at 03:45 | #23

For code blocks, use <pre lang="javascript">. css and html4strict are also accepted.