www.webdeveloper.com
Results 1 to 3 of 3

Thread: Changing the Background of a Table Monthly

  1. #1
    Join Date
    May 2004
    Location
    Baltimore, MD
    Posts
    4

    Question Changing the Background of a Table Monthly

    I would like to ask if anyone knows of a JavaScript routine that will change the background of a table on a monthly basis.

    I took a script that changes pictures on a monthly cycle and tried to adapt it to the table background. Unfortunately, I am not very good with javascript, despite my love for the scripting and the things it can do.

    If anyone can help, it would definitely be appreciated.

    Thanks!
    Last edited by AngelAndCo; 02-09-2009 at 11:54 AM.

  2. #2
    Join Date
    Feb 2008
    Posts
    1,666
    T'is very easy:
    HTML Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
                          "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Language" content="en-us">
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Dynamic Table Background</title>
    </head>
    
    <body>
    <table id="mytable" border="1" cellpadding="2" style="border-collapse:collapse">
      <tr>
        <th align="center">Su</th><th align="center">Mo</th><th align="center">Tu</th>
        <th align="center">We</th><th align="center">Th</th><th align="center">Fr</th>
    	<th align="center">Sa</th></tr>
      <tr>
        <td align="center">&nbsp;</td><td align="center">&nbsp;</td><td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td><td align="center">&nbsp;</td><td align="center">1</td>
    	<td align="center">2</td></tr>
      <tr>
        <td align="center">3</td><td align="center">4</td><td align="center">5</td>
    	<td align="center">6</td><td align="center">7</td><td align="center">8</td>
    	<td align="center">9</td></tr>
      <tr>
        <td align="center">10</td><td align="center">11</td><td align="center">12</td>
    	<td align="center">13</td><td align="center">14</td><td align="center">15</td>
    	<td align="center">16</td></tr>
      <tr>
        <td align="center">17</td><td align="center">18</td><td align="center">19</td>
    	<td align="center">20</td><td align="center">21</td><td align="center">22</td>
    	<td align="center">23</td></tr>
      <tr>
        <td align="center">24</td><td align="center">25</td><td align="center">26</td>
    	<td align="center">27</td><td align="center">28</td><td align="center">29</td>
    	<td align="center">30</td></tr>
      <tr>
        <td align="center">31</td><td align="center">&nbsp;</td><td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td><td align="center">&nbsp;</td><td align="center">&nbsp;</td>
    	<td align="center">&nbsp;</td></tr>
    </table>
    
    <script type="text/javascript">
    <!-- //
    var bgrounds = new Array(
        "/images/january.jpg",
        "/images/february.jpg",
        "/images/march.jpg",
        "/images/april.jpg",
        "/images/may.jpg",
        "/images/june.jpg",
        "/images/july.jpg",
        "/images/august.jpg",
        "/images/september.jpg",
        "/images/october.jpg",
        "/images/november.jpg",
        "/images/december.jpg"
    ); // no comma after last item above
    var url = bgrounds[(new Date()).getMonth()];
    document.getElementById("mytable").style.backgroundImage = "url('"+url+"')";
    // -->
    </script>
    </body>
    </html>

  3. #3
    Join Date
    May 2004
    Location
    Baltimore, MD
    Posts
    4

    Thumbs up Changing Background ...

    Thank you so much! You are a life saver!

    Pamela A. Jackson,
    President/CEO
    Angel & Co. Enterprises, Inc.
    Windsor Mill, MD USA

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles