Jump to content
vBWarez - Rest In Peace

Recommended Posts

This is a CSS/Script that displays Holiday banners based on current date.
No having to change the banner manually.
If no holiday is observed then a random non-holiday banner is selected :)
I created this as I got annoyed with trying to remember.
This one is set up for major Public US holidays.
The States have Public, Federal, State, National and god help all, Hallmark holidays. Also, over 3,000 religions and their holidays. This isn't even to mention holidays of other nations. So don't expecting me to add them all.

Use the Site Builder and create a new module using Static HTML.
Add this code-

[CODE]<vb:if condition="is_member_of($user, 2)">
<style>
.HolidayBanner {
border-radius: 8px;
border: 1px solid #ddd;
border-radius: 4px;
padding: 5px;
max-width: 100%;
height: auto;
background-color: #000000;
margin-left: auto;
margin-right: auto;
display: flex;
align-items: center;
}
</style>
<script type="text/javascript">

var pic='';
var mytime=new Date();
var Today = mytime.getDate();
var Month = mytime.getMonth()+1;
if (Month==12 && Today >= 27) {pic="<img class='HolidayBanner' src='/Holiday/banners/Happy-New-Year-Banner.jpg' />";
} else if (Month==1 && Today <= 3) {pic="<img class='HolidayBanner' src='/Holiday/banners/Happy-New-Year-Banner.jpg' />";
} else if (Month==1 && Today==18) {pic="<img class='HolidayBanner' src='/Holiday/banners/martin-luther-king-jr.png' />";
} else if (Month==2 && Today==2) {pic="<img class='HolidayBanner' src='/Holiday/banners/GroundHogDay.jpg' />";
} else if (Month==2 && Today==14) {pic="<img class='HolidayBanner' src='/Holiday/banners/Happy-Valentines-Day.jpg' />";
} else if (Month==3 && Today==17) {pic="<img class='HolidayBanner' src='/Holiday/banners/StPD.jpg' />";
} else if (Month==3 && Today >= 25 && Today <= 28){pic="<img class='HolidayBanner' src='/Holiday/banners/Easter.jpg' />";
} else if (Month==7 && Today==4) {pic="<img class='HolidayBanner' src='/Holiday/banners/Independence_Day.jpg' />";
} else if (Month==10 && Today >= 30) {pic="<img class='HolidayBanner' src='/Holiday/banners/Halloween.jpg' />";
} else if (Month==11 && Today <= 2) {pic="<img class='HolidayBanner' src='/Holiday/banners/Halloween.jpg' />";
} else if (Month==12 && Today >= 23 && Today <= 26){pic="<img class='HolidayBanner' src='/Holiday/banners/XMas.jpg' />";
} else function random_imglink(){
var myimages=new Array()

myimages[1]="1.jpg"
myimages[2]="2.jpg"
myimages[3]="3.jpg"
myimages[4]="4.jpg"
myimages[5]="5.jpg"
myimages[6]="6.jpg"
myimages[7]="7.jpg"
myimages[8]="8.jpg"
myimages[9]="9.jpg"
myimages[10]="10.jpg"
myimages[11]="11.jpg"
myimages[12]="12.jpg"
myimages[13]="13.jpg"
myimages[14]="14.jpg"
myimages[15]="15.jpg"
myimages[16]="16.jpg"
myimages[17]="17.jpg"
myimages[18]="18.jpg"
myimages[19]="19.jpg"
myimages[20]="20.jpg"
myimages[21]="21.jpg"
myimages[22]="22.jpg"
myimages[23]="23.jpg"
myimages[24]="24.jpg"
myimages[25]="25.jpg"

var ry=Math.floor(Math.random()*myimages.length)
if (ry==0)
ry=1
pic="<img class='HolidayBanner' src='/Holiday/banners/blank.gif'>";
document.write('<p>No observances today.</p><br /><img class="HolidayBanner" src="/Holiday/banners/'+myimages[ry]+'" />');
}
document.write(pic);
random_imglink()
</script>
</vb:if>
[/CODE]

Download, extract and add Holiday folder to root/HTDOCS or base folder of forum.
[ATTACH]11271[/ATTACH] 1.09 Mb

Reload site where you added new Holiday module and you should see something like this-
[CENTER][img]http://s32.postimg.org/vc4y0xnyt/Holiday.jpg[/img][/CENTER]
Link to post
Share on other sites
[QUOTE]
Snail,
Can this code be used for anigifs as banners?[/QUOTE]

GIF's, PNG, JPG, BMP... all standard web graphic formats.

Further, with some minor changes, SWF, AVI, MP4, OGG...
and, by switching out images for CSS files, entire site themes.
The PIC values and Document.Write need to be changed to accomplish, but easily done.
By adding a little more code and <audio> tag one can do holiday banners with holiday music too.
Or by adding STYLE sheets, audio and flash, one could do major holiday theme changes without touching forum code :)
Very simple yet useful code to accomplish much with few alterations.
Best part being all automated.
Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...