ALBCODERS |
12-27-2010 10:00 PM |
Christmas Message with jquery
1 Attachment(s)
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.
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:
HTML Code:
<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:
HTML Code:
<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>
|