SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Enthusiast
    Join Date
    Feb 2007
    Posts
    37
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    JavaScript PLUS CSS

    I Need help.
    I dunno nothing about javacript, but i need a script that does this logic:


    PHP Code:

    If Time() >= 8:00 and < 13:00 then the page's background picture is "back1.jpg"

    If Time() >= 13:00 and < 19:00 then the page'
    s background picture is "back2.jpg"

    If Time() >= 19:00 and <= 23:59 then the page's background picture is "back3.jpg"

    If Time() >= 00:00 and < 8:00 then the page'
    s background picture is "back4.jpg" 

    I dont know how you do the changes to the <Body> tag's picture trought javascript so i wrote "the page's background picture is "back1.jpg"".

    If you could get me a script that do that.

    Thanks!

  2. #2
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,035
    Mentioned
    187 Post(s)
    Tagged
    2 Thread(s)

    image change

    This reminds me of an old homework assignment I once had. I forgot how I did it now, but I think I found the answer at the HTMLgoodies site listed under "stupid javascript tricks" if my memory serves.

  3. #3
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Best to do the stupid trick on the server side anyway. Get the time, embed body {background:url(whatever.jpg);} into the <head>.

    Think about how much it might annoy the user it's not consistent every time. If it's not overpowering it might be OK, but in general consistency is a pretty good thing.

  4. #4
    SitePoint Enthusiast
    Join Date
    Feb 2007
    Posts
    37
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Too many results shown in html goodies, but i cant find a script that changes the background picture.

  5. #5
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    What server-side language are you using? Do it with that. I suppose this would be a way to do it with javascript, but again, this would be best done on the server side.

    Code:
    window.onload = function() {
      var date = new Date();
      var hour = date.getHours();
      var i; 
      if (hour <= 8) i = 1;
      else if (hour <= 13) i = 2;
      else if (hour <= 19) i = 3;
      else if (hour <= 23) i = 4;
      else i = 1;
      body.style.backgroundImage = 'url(back'+i+'.jpg)';
    }

  6. #6
    SitePoint Enthusiast
    Join Date
    Feb 2007
    Posts
    37
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I cant do on the server side because my site is a phpbb forum, and the templates can only be maneged with CSS and Html.

    www.1001noites.pt.vu

    I'll try it, Thanks!

  7. #7
    SitePoint Enthusiast
    Join Date
    Feb 2007
    Posts
    37
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Raffles View Post
    What server-side language are you using? Do it with that. I suppose this would be a way to do it with javascript, but again, this would be best done on the server side.

    Code:
    window.onload = function() {
      var date = new Date();
      var hour = date.getHours();
      var i; 
      if (hour <= 8) i = 1;
      else if (hour <= 13) i = 2;
      else if (hour <= 19) i = 3;
      else if (hour <= 23) i = 4;
      else i = 1;
      body.style.backgroundImage = 'url(back'+i+'.jpg)';
    }
    I tried to do it on my computer in FrontPage, but its not working.
    no error messages, and no reaction from the script.

    I tried to put it in the header and body.

    Like this:

    PHP Code:
    <head>
    <
    meta http-equiv="Content-Language" content="pt">


    </
    head>
    <
    body>
    <
    p>hgfhgfhfhgfhfg</p>
    <
    script language="Javascript" type="text/javascript">
    <!--

    window.onload = function() {
      var 
    date = new Date();
      var 
    hour date.getHours();
      var 
    i
      if (
    hour <= 81;
      else if (
    hour <= 132;
      else if (
    hour <= 193;
      else if (
    hour <= 234;
      else 
    1;
      
    body.style.backgroundImage 'url(back'+i+'.jpg)';
    }
    //-->
    </script>

    </body> 



    PHP Code:
    <head>
    <
    meta http-equiv="Content-Language" content="pt">

    <
    script language="Javascript" type="text/javascript">
    <!--

    window.onload = function() {
      var 
    date = new Date();
      var 
    hour date.getHours();
      var 
    i
      if (
    hour <= 81;
      else if (
    hour <= 132;
      else if (
    hour <= 193;
      else if (
    hour <= 234;
      else 
    1;
      
    body.style.backgroundImage 'url(back'+i+'.jpg)';
    }
    //-->
    </script>
    </head>
    <body>
    <p>hgfhgfhfhgfhfg</p>


    </body> 
    The image files exist in the same folder as the script.

  8. #8
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    It must go in the header. And I made a mistake. It should be document.body.style.backgroundImage:

    HTML Code:
    <head>
    <meta http-equiv="Content-Language" content="pt">
    
    <script type="text/javascript">
    window.onload = function() {
      var date = new Date();
      var hour = date.getHours();
      var i;
      if (hour <= 8) i = 1;
      else if (hour <= 13) i = 2;
      else if (hour <= 19) i = 3;
      else if (hour <= 23) i = 4;
      else i = 1;
      document.body.style.backgroundImage = 'url(back'+i+'.jpg)';
    }
    </script>
    </head>
    <body>
    <p>hgfhgfhfhgfhfg</p>
    
    
    </body>

  9. #9
    SitePoint Enthusiast
    Join Date
    Feb 2007
    Posts
    37
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It works!!!

    Thanks!!!


Bookmarks

Posting Permissions

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