Christmas Message with jquery

[ALBCODERS]

Hi to all, this was a wordpress plugin (http://wordpress.org/extend/plugins/christmas-message/download/) by CSSJockey (http://www.cssjockey.com/freebies/christmas-gifts-from-cj-santa) 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.

http://www.albcoders.com/images/christmasgif.gif

Live DEMO (http://www.albcoders.com/forum.php)

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

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

<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? :D

[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]

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?

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]

It's a bit late? :D

A day late and a dollar short. :)

for 2012 :rolleyes:

[GamerPerfection]

for 2012 :rolleyes: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:

[kfyonur]

Thanx it is very nice.

[Dr.osamA]

installed + 5 stars
thank you bro

for good mods is never to late

we can use the code for other MODs

happy new yaer

[Juggernaut]

Loving it, I have a Happy New Year message running in my site with this mod :D

[ALBCODERS]

Happy New Year Friends ;) Thanks

[GamerPerfection]

What if you want to use it for several things throughout the year? How do you get it to appear again when you've changed the message and images etc?

[taavipost]

Gonna use it in christmas. ;)

[bosanci28]

hmm,thats a good idea! thanks

[nerowolfe]

Like it!

That's possible to insert only for date 25 Dicember?

Ty at all