Time slider html/javascript only

hey guys. I'm trying to create a time slider widget for a website, like a range slider but from midnight to 11:59. I've seen the jquery plugins and a couple of others but I can't use external libraries in my project :( Does anyone know how to build a widget like that using just html/css/javascript? Or is it even possible? If not, does anyone know how to do it with jquery? Thanks:)

Just because you can’t use third-party libraries doesn’t mean you can’t look at them to get an idea of how they implement it. Do you have some examples you can point us to? How precise does this need to be? Does if have to be to the exact second, or is minutes good enough? Even if you step at minutes that’s still 1440 steps, which is quite a lot for one slider. Can you have a separate slider for hours and minutes (and seconds if you need to be that precise)?

thanks. I've looked at the material widget and the basic date/time picker in jquery. I've also looked around for sourcecode for a similar widget but I haven't found any.

The time thing is a good question. Base precision would be to minutes. The problem with two sliders would be for the minute one. The slider is also supposed to move the position of an object over time, so with the jump from like 3:59 to 4:00 would require the user to increase the hour slider by one, but go all the way back to the start of the second slider

I guess I’m not exactly sure what the purpose of your time slider is? I was assuming it was going to be used to set a specific time but it sounds like it is more about positioning an object? I think you need to provide more details on what exactly you are trying to do.

The reason I suggested two sliders is because having 1440 steps on a slider is going to be hard to use if precision is important. Especially on a touch device, I can only imagine how long it will take someone to get to the exact time they want using their finger to pinpoint a very small spot on the slider. But maybe this isn’t necessary? Again, until I know exactly what you are trying to do it is hard to offer any good advice.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.