What is better than unicorns and rainbows? Not much. What is better than unicorns, rainbows, and jQuery? Nothing, and for this very reason I've created an incredibly awesome jQuery plugin that involves unicorns and rainbows. I don't want to spoil the surprise so go ahead and click the button above that says "Summon the Unicorns!!!".

How To Use

If you want to use this plugin the first thing you need to do is download a nifty little zip file that contains all the necessary files.

There are three ways to use this plugin but first let's take a look at the basic setup. This little page includes jQuery, the unicorblast script, and the html markup for the examples below. It is very important to add the HTML5 doctype for sound playback.

<!DOCTYPE html>
<html>
    <head>
        <!-- jQuery from google, thanks google. -->
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>

        <!-- unicornblast js file -->
        <script src="js/jquery.unicornblast.js"></script>
    </head>
    <body>
        <h1>UNICORNS AND RAINBOWS!!!!!!</h1>
        <a href="" id="button">Click me</a> to make this page so much happier.</p>
    </body>
</html>

1) Click event

Attach UnicornBLAST to an element and the default behavior will be when a user clicks that element it will start the fun.

<script>
    $(window).load(function() {
        $("#button").unicornblast();	
    });
</script>

2) Timer

Want to give the visitor a false sense of security and then surprise them with rainbows and unicorns? Then the delay option is what you are looking for! Set the start option to 'delay'. There is also a delayTime option that sets delay time in milliseconds before the unicorns start flying. This defaults to 5000 (5 seconds for the mathematically challenged) if not defined.

<script>
    $(window).load(function() {
        $("#button").unicornblast({
	    start : 'delay',
            delayTime : 6000
        });
    });
</script>

3) Konami Code

What good would this plugin be if you couldn't activate it with the oh so famous konami code? Well crisis averted because you can! You also get a nice little musical bonus when you activate UnicornBLAST this way. Attach unicornBLAST to any element and set the start option to 'konamiCode'. If this doesn't work for you it's because you are a n00b using Internet Explorer and I didn't feel like wasting my life away making this work on IE.

<script>
    $(window).load(function() {
        $("#button").unicornblast({
	    start : 'konamiCode'
        });
    });
</script>

One More Option

There is one more option that allows you to customize this plugin to your hearts delight. There is an option called numberOfFlyBys that defines how many times a unicorn will fly across the screen.

<script>
    $(window).load(function() {
        $("#button").unicornblast({
	    numberOfFlyBys: 4
        });
    });
</script>

Props

It obviously goes without saying this site has been inspired by the likes of cornify.com and the jQuery Raptorize plugin but it was my good friend Wes Nolte that truly inspired me to create this plugin. I was working on a project and he said, "I know for a fact Jason's solution has unicorns flying over rainbows" but my project did not have this and it made me sad. So I took a stab at creating my first jQuery plugin that has no actual usefulness other than fun and shenanigans.

Legal Mumbo Jumbo

This plugin is free to use and distribute under the I built it and I say you can use it for whatever you want license. Yet it does use jQuery and that uses the MIT license so if you want to get all warm and cozy with legal speak feel free to use it under the MIT License.

Oh, and I claim no responsibility if you decide to put this cool plugin on a public website or company intranet and then get fired for screwing off at work. Really though... you would probably get a raise and promotion.