Help Change image by the time of day

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts
  • BennBenn
    Staff Sergeant

    • Oct 2009
    • 40

    Help Change image by the time of day

    I seen the how to instruction on the images change with the time of day
    I'm just a beginner and don't understand much of nothing
    can some one help to make this easy as possible for me?


    it say:
    "Now that you have the image, the next step is to copy the following script and attach it to the head section of your page.

    // Time of Day Image Script
    // copyright Stephen Chapman, 20th Jan 2005
    // you may copy this script but please keep the copyright notice as well
    function timeOfDayImage() {
    var now = new Date;
    var timeNow = now.getHours();
    var img = null; var mess = '';
    if #timeNow < 4 || timeNow > 20# {
    img = 'time1#gif'; mess = 'night';
    } else if #timeNow < 6# {
    img = 'time2#gif'; mess = 'dawn';
    } else if #timeNow < 8# {
    img = 'time3#gif'; mess = 'early morning';
    } else if #timeNow < 11# {
    img = 'time4#gif'; mess = 'morning';
    } else if #timeNow < 13# {
    img = 'time5#gif'; mess = 'noon';
    } else if #timeNow < 16# {
    img = 'time6#gif'; mess = 'afternoon';
    } else if #timeNow < 18# {
    img = 'time7#gif'; mess = 'late afternoon';
    } else {
    img = 'time8#gif'; mess = 'sunset';
    }
    document#write('<img src="graphics\/'+img+'" width="200" height="80" alt="'+mess+'"

    title="'+mess+'" />');
    }

    Then say:
    "Once you have copied the code you just save it to an external javascript file. I called mine tod.js. You then link it into the head of your page using the following code:"

    <script type="text/javascript" src="tod.js">
    </script>


    My first question is: If i copy the first code, how do I attach it in to Head ?
    then it say in the baton - something about an External file and to link it to the second code,
    How to do this?

    If you like to see the whole thing
    I got this script from this page:
    http://javascript.about.com/library/bltod3.htm

    Can some one make this as Easy as possible for me.
    I'm a rooky, if some one can make it an Easy Step by Step
    or put it together for me to just copy it and paste it on the the page.

    PS. Please excuse my English.
  • Collectors-info
    General

    • Feb 2006
    • 8703

    #2
    Re: Help Change image by the time of day

    Couldn't get that one to work for some reason? But the one below might be more simple.
    Cut & paste the script into notepad & Just change the image url's to your own & also the times (marked in red). Also add your images to the page using the BV file uploaded as they will then stay in the same directory. Then just cut & paste the script from notepad to a html box on your BV page.
    -----------------------------------------------------------------------



    <a href="javascript:SurferHandler()">
    <script>

    //Time of day message script- by javascriptkit.com
    //Visit JavaScript Kit (http://javascriptkit.com) for script
    //Credit must stay intact for use

    var Digital=new Date()
    var hours=Digital.getHours()

    //Configure message below to your own.
    if (hours>=6&&hours<=9)
    document.write('<img src="time2.gif" border=0>')
    else if (hours>=9&&hours<=11)
    document.write('<img src="time4.gif" border=0>')
    else if (hours>=11&&hours<=13)
    document.write('<img src="time5.gif" border=0>')
    else if (hours>=13&&hours<=15)
    document.write('<img src="time6.gif" border=0>')
    else if (hours>=15&&hours<=1
    document.write('<img src="time6.gif" border=0>')
    else if (hours>=18&&hours<=20)
    document.write('<img src="time7.gif" border=0>')
    else if (hours>=20&&hours<=22)
    document.write('<img src="time1.gif" border=0>')
    else if (hours>=22&&hours<=1)
    document.write('<img src="time1.gif" border=0>')
    else if (hours>=1&&hours<=5)
    document.write('<img src="time1.gif" border=0>')

    </script></a>
    Regards Chris.

    Collectables, Collecting, collectors-info.com

    www.chrismorris.co.uk

    House build project

    Comment

    • BennBenn
      Staff Sergeant

      • Oct 2009
      • 40

      #3
      Re: Help Change image by the time of day

      Sorry.
      but i see two parts in red
      I'm realy not to good on this
      can you explain the first part how to set it?

      //Configure message below to your own.
      if (hours>=6&&hours<=9)

      How to configuer this part?
      i see the 6 and the 9, but have no idea hot to set it
      Thanks

      Comment

      • BennBenn
        Staff Sergeant

        • Oct 2009
        • 40

        #4
        Re: Help Change image by the time of day

        Well i look and look, Finally found a script less complicated and it's just a copy and paste
        I replace the original images with my images and it work perfect.
        but as you can see, I'm very so don't know much about anything

        The script is as fallow



        <script>
        <!--
        /*By George Chiang (JK's JavaScript tutorial)
        http://www.javascriptkit.com
        Credit must stay intact for use*/
        var current= new Date()
        var day_night=current.getHours()
        if (day_night<=12)
        document.write("<img src='img1.gif'>")
        else
        document.write("<img src='img2.gif'>")
        //-->
        </script>


        The help i need is to add more time to it.
        I have 3 images and I'll like to set it this way

        From 5am to 7am to show images 1
        From 7am to 5pm to show images 2
        From 5pm to 7pm to show images 1
        From 7pm to 5am to show images 3

        Can some one help PLEASE

        Comment

        • BennBenn
          Staff Sergeant

          • Oct 2009
          • 40

          #5
          Re: Help Change image by the time of day

          Originally posted by Collectors-info View Post
          Couldn't get that one to work for some reason? But the one below might be more simple.
          Cut & paste the script into notepad & Just change the image url's to your own & also the times (marked in red). Also add your images to the page using the BV file uploaded as they will then stay in the same directory. Then just cut & paste the script from notepad to a html box on your BV page.
          -----------------------------------------------------------------------



          <a href="javascript:SurferHandler()">
          <script>

          //Time of day message script- by javascriptkit.com
          //Visit JavaScript Kit (http://javascriptkit.com) for script
          //Credit must stay intact for use

          var Digital=new Date()
          var hours=Digital.getHours()

          //Configure message below to your own.
          if (hours>=6&&hours<=9)
          document.write('<img src="time2.gif" border=0>')
          else if (hours>=9&&hours<=11)
          document.write('<img src="time4.gif" border=0>')
          else if (hours>=11&&hours<=13)
          document.write('<img src="time5.gif" border=0>')
          else if (hours>=13&&hours<=15)
          document.write('<img src="time6.gif" border=0>')
          else if (hours>=15&&hours<=1
          document.write('<img src="time6.gif" border=0>')
          else if (hours>=18&&hours<=20)
          document.write('<img src="time7.gif" border=0>')
          else if (hours>=20&&hours<=22)
          document.write('<img src="time1.gif" border=0>')
          else if (hours>=22&&hours<=1)
          document.write('<img src="time1.gif" border=0>')
          else if (hours>=1&&hours<=5)
          document.write('<img src="time1.gif" border=0>')

          </script></a>


          Sorry.
          but i see two parts in red
          I'm realy not to good on this
          can you explain the first part how to set it?

          //Configure message below to your own.
          if (hours>=6&&hours<=9)

          How to configuer this part?
          i see the 6 and the 9, but have no idea how to set it
          or what in meen
          Thanks

          Comment

          • Collectors-info
            General

            • Feb 2006
            • 8703

            #6
            Re: Help Change image by the time of day

            The 6 & 9 means from 6am to 9 am that image will be displayed.
            You might prefer to enter a different time setting or just leave as it is.
            As you look down the script the are more time changes.
            Regards Chris.

            Collectables, Collecting, collectors-info.com

            www.chrismorris.co.uk

            House build project

            Comment

            • BennBenn
              Staff Sergeant

              • Oct 2009
              • 40

              #7
              Re: Help Change image by the time of day

              Thanks Very much, I'll try it an let you know

              What about the other one that i put below?

              Comment

              • Collectors-info
                General

                • Feb 2006
                • 8703

                #8
                Re: Help Change image by the time of day

                Its just a day & night script.
                Regards Chris.

                Collectables, Collecting, collectors-info.com

                www.chrismorris.co.uk

                House build project

                Comment

                • BennBenn
                  Staff Sergeant

                  • Oct 2009
                  • 40

                  #9
                  Re: Help Change image by the time of day

                  Originally posted by Collectors-info View Post
                  The 6 & 9 means from 6am to 9 am that image will be displayed.
                  You might prefer to enter a different time setting or just leave as it is.
                  As you look down the script the are more time changes.
                  ----------------------------------------------------------------------

                  Thanks a lot - it was helpful and it's working
                  the only change i made was, removing the extra cuotation it hade
                  you hade it set:
                  ("<img src="img1.jpg" border=0>")
                  now it look like this
                  ("<img src='img1.jpg' border=0>")

                  The complete code look like this now
                  and it's perfect - Thank u much Collectors-Info



                  <a href="javascript:SurferHandler()">
                  <script>

                  //Time of day message script- by javascriptkit.com
                  //Visit JavaScript Kit (
                  http://javascriptkit.com) for script
                  //Credit must stay intact for use

                  var Digital=new Date()
                  var hours=Digital.getHours()

                  //Configure message below to your own.
                  if (hours>=5&&hours<=7)
                  document.write("<img src='img2.jpg' border=0>")
                  else if (hours>=7&&hours<=17)
                  document.write("<img src='img1.jpg' border=0>")
                  else if (hours>=17&&hours<=19)
                  document.write("<img src='img2.jpg' border=0>")
                  else if (hours>=19&&hours<=5)
                  document.write("<img src='img3.jpg' border=0>")

                  </script></a>

                  My page is Spanish


                  Excuse my english.

                  Comment

                  • BennBenn
                    Staff Sergeant

                    • Oct 2009
                    • 40

                    #10
                    Re: Help Change image by the time of day

                    Here is the Script i Used, here it is
                    for if any one will like a easy Script
                    just copy paste and fix the time - -
                    Thanks: Collector-Info


                    <a href="javascript:SurferHandler()">
                    <script>
                    //Time of day message script- by javascriptkit.com
                    //Visit JavaScript Kit (http://javascriptkit.com) for script
                    //Credit must stay intact for use
                    var current=new Date()
                    var hours=current.getHours()
                    //Configure message below to your own.
                    if (hours>=3&&hours<=4)
                    document.write("<img src='ATL-BG-IMG1.jpg' border=0>")
                    else if (hours>=4&&hours<=5)
                    document.write("<img src='ATL-BG-IMG2.jpg' border=0>")
                    else if (hours>=5&&hours<=
                    document.write("<img src='ATL-BG-IMG3.jpg' border=0>")
                    else if (hours>=8&&hours<=15)
                    document.write("<img src='ATL-BG-IMG4.jpg' border=0>")
                    else if (hours>=15&&hours<=17)
                    document.write("<img src='ATL-BG-IMG3.jpg' border=0>")
                    else if (hours>=17&&hours<=1
                    document.write("<img src='ATL-BG-IMG2.jpg' border=0>")
                    else if (hours>=18&&hours<=19)
                    document.write("<img src='ATL-BG-IMG1.jpg' border=0>")
                    else if (hours>=19&&hours<=20)
                    document.write("<img src='ATL-BG-IMG5.jpg' border=0>")
                    else if (hours>=20&&hours<=24)
                    document.write("<img src='ATL-BG-IMG6.jpg' border=0>")
                    else if (hours>=0&&hours<=1)
                    document.write("<img src='ATL-BG-IMG6.jpg' border=0>")
                    else if (hours>=1&&hours<=3)
                    document.write("<img src='ATL-BG-IMG6.jpg' border=0>")
                    </script></a>

                    Comment

                    Working...
                    X