The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript Image Timer in Javascript

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #41741

    I want to make a image slider it will have to slide according to time and i have no idea how to do this can anyone can help me.


    here the scenario is
    i have 7 images
    i put those images one down other
    by setting left margin -100px,zindex=0 ,position=relative of each image.

    now i want to set the zindex property according to system time.

    I tired to do this with the help of loop but i failed


    It sounds to me like you’re either:

    A.) Wanting to set which image displays based on what the time of day is, so if it’s 07:00-10:00, show image A, if it’s 10:01-13:00, show image B, and so forth.

    Or B.) Wanting to set a timed delay on the slider function, so that the images progress in sequence after a set period of time, say every x seconds or every x minutes.

    Either of these cases is pretty simple, I should imagine. Situation A seems the most interesting (and if I’m reading your posts correctly, the most likely), so I’ll tackle that first.

    This may or may not be the most elegant way to go about it, as I’m no JavaScript expert yet, but I’d say a simple switch statement based on the current hour would do it. Take a look at this: [](”)

    Basically, it just grabs the current date/time, filters out the hour and plops that into a variable, which is then referenced by the switch to get 3-hour ranges, and whichever range matches applies a class of “current” to the respective element. That class sets the z-index.

    I was far too lazy to make images, so I used colored backgrounds, and included an overlay with the a readout of the current time and comments in the HTML so you can see which lines up with which.

    I hope this helps!

    For B, just use setTimeout.

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.