Mini Mods - Christmas Message with jquery

Hi to all, this was a wordpress plugin by CSSJockey but I have just fixed it for vbulletin for my Forum and i want to share with you.
With This template modification your visitors will see this sexy message only one time on your site.

Live DEMO

Upload the Images folder on your root directory and follow this instructions:

Open your headinclude template and add the code at the bottom:

PHP Code:

<link rel="stylesheet" href="{vb:raw vboptions.bburl}/images/christmas/style.css" media="screen" />
<link rel="stylesheet" href="{vb:raw vboptions.bburl}/images/christmas/scroll.css" media="screen" />
<script type="text/javascript" src="{vb:raw vboptions.bburl}/images/christmas/jquery.js"></script>
<script type="text/javascript" src="{vb:raw vboptions.bburl}/images/christmas/scroll.js"></script>
<script type="text/javascript" src="{vb:raw vboptions.bburl}/images/christmas/rounded.js"></script>
<script type="text/javascript" src="{vb:raw vboptions.bburl}/images/christmas/jquery.cookie.js"></script>
<!--[if lte IE 6]>
<link rel="stylesheet" type="text/css" href="{vb:raw vboptions.bburl}/images/christmas/styleie6.css" media="screen" />
<script type="text/javascript"> DD_roundies.addRule('.pngfix'); </script>
<![endif]-->
<!--[if lte IE 7]>
<link rel="stylesheet" type="text/css" href="{vb:raw vboptions.bburl}/images/christmas/styleie7.css" media="screen" />
<![endif]-->
<script type="text/javascript">
    var $xmas = jQuery.noConflict();
    $xmas(window).ready(function(){
    var show = $xmas.cookie("xmas");
    if(show == null){
        $xmas('#xmas').fadeIn(300, function(){
        $xmas(this).removeClass('hidden');
        });
    }
    })
    $xmas(document).ready(function(){
    $xmas('a#xmasclose').click(function(){
        $xmas('#xmas').fadeOut(300, function(){
        $xmas(this).addClass('hidden');
        })
        $xmas.cookie("xmas", "0", {expires: 1});
        return false;
    })

    })
    $xmas(function(){
    $xmas('.xmas-msg').jScrollPane({showArrows:true});
    });

</script> 


Now Firs Edit your message and open the footer template to add the code on the top:

<div id="xmas" class="xmas-hidden">
    <div id="xmas-santa">
	<img class="pngfix" src="{vb:raw vboptions.bburl}/images/christmas/xmas-santa.png" alt="" />
    </div><!-- /xmas-santa -->
    <div id="xmas-bg" class="pngfix">
	<h1 class="xmas-h1">Marry Christmas</h1>
	<div class="xmas-msg">
	    Your Message Goes Here!!!!!!!!!
	</div><!-- /xmas-msg -->
	<div id="xmas-close"><a id="xmasclose" href="#" title="Close">Close</a></div><!-- /xmas-close -->
    </div><!-- /xmas-bg -->
</div><!-- /xmas -->

If you want to show it only to unregistered users use this other one:

<vb:if condition="$show['guest']">
<div id="xmas" class="xmas-hidden">
    <div id="xmas-santa">
	<img class="pngfix" src="{vb:raw vboptions.bburl}/images/christmas/xmas-santa.png" alt="" />
    </div><!-- /xmas-santa -->
    <div id="xmas-bg" class="pngfix">
	<h1 class="xmas-h1">Marry Christmas</h1>
	<div class="xmas-msg">
	    Your Message Goes Here!!!!!!!!!
	</div><!-- /xmas-msg -->
	<div id="xmas-close"><a id="xmasclose" href="#" title="Close">Close</a></div><!-- /xmas-close -->
    </div><!-- /xmas-bg -->
</div><!-- /xmas -->
</vb:if>

[LouisB]

It's a bit late?

[worried]

A day late and a dollar short.

[whitedd]

nice...instaled...for good mods is never to late...

[Taurus1]

Thank you very much. I just replaced the 2 images with something for New Year, and changed the text. And it looks great for New Years!

[Krusty1231]

How to get this to appear everytime - or at least until I change out the pictures....then change it back....lol....I was able to view my changes the first time.....but now I can't seem to bring it back....I feel kind of dumb about that right now. lol.

[Huy Ho?ng]

Very nice

[RobbieZ]

Originally Posted by Taurus1

Thank you very much. I just replaced the 2 images with something for New Year, and changed the text. And it looks great for New Years!

Are you willing to share your images you used for new year?

Originally Posted by Krusty1231

How to get this to appear everytime - or at least until I change out the pictures....then change it back....lol....I was able to view my changes the first time.....but now I can't seem to bring it back....I feel kind of dumb about that right now. lol.

Try clearing your cookies.

[ALBCODERS]

Originally Posted by LouisB

It's a bit late?

Originally Posted by worried

A day late and a dollar short.

for 2012

[GamerPerfection]

Originally Posted by AlbCoder

for 2012

lol you mean 2011?

Think I might try this for New Year.

Then there's the anniversary of my forums.... then Xmas 2011....

Lots of reasons to have this Mod. :up: