I just updated my site theme again, this time it changes the background image based on the time of the day. It is extremely easy to do this with .NET.
<script language="C#" runat="server"> protected string GetFooterId() { int hours = DateTime.Now.TimeOfDay.Hours; if (hours > 12 && hours < 18) return "footer-container-men"; else if (hours > 17) return "footer-container-truck"; return "footer-container"; } </script>
Then I call this method on my master page like this:
<div id='<%= GetFooterId() %>'>
Pretty easy huh? All you need to do is just add some styles that display different images for each of the ids.
#footer-container-truck { padding: 0px; background: url(../images/truck.png) no-repeat bottom right; height: 250px; position: fixed; bottom: 0px; width: 100%; z-index: 1; overflow: hidden; } #footer-container-men { padding: 0px; background: url(../images/gentlemen.png) no-repeat bottom right; height: 700px; position: fixed; bottom: 0px; width: 100%; z-index: 1; overflow: hidden; }
Check back at my site in the morning and you should see a different background.