Using Jquery plugin to create a splash page

JavaScript
1

I am using a jquery plugin to create a splash page but can’t get it to work, wondering if i could get some help.
here is the plugin page: http://meerkat.jarodtaylor.com/how-to/meerkat-splash-page/

and here is my code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>Splash Page Test</title>

 <script type="text/javascript" src="scripts/jquery.meerkat.1.3.min.js"></script>

<script type="text/javascript" src="scripts/jquery-1.4.2.min.js"></script>

 <script type="text/javascript">

$(function(){

$('.meerkat').meerkat({

background: '#f7fcfa url(images/bg-splash.png) repeat-x left top',
height: '100%',
width: '100%',
position: 'bottom',
dontShowAgain: '#enter',
animationIn: 'none',
animationOut: 'fade',
animationSpeed: 500,
timer: 2,
removeCookie: '.reset'

            });

});

</script>

 </head>

     <body>
         <div class="meerkat">
            <img id="enter" src="images/ChristineLeadman_mockup1.jpg" />
         </div>
</body>

</html>

So when I test the page nothing happens, I am expecting the image to appear then fade out using the jquery script and plugin which is attached

2

Are you getting any error messages?

The site doesn’t go into detail or show it, but my guess is that the meerkat script depends on the jquery script being loaded in before it.