2009-07-15 4 views
5

Je cherche une sorte de widget TimeRange en Javascript/CSS/jQuery. Je ne cherche pas de sélecteur d'heure et de date, qui sont largement disponibles.Où puis-je trouver un widget de plage de temps dans Javascript/jQuery?

J'ai besoin d'un site Web pour permettre aux entreprises de choisir leurs heures d'ouverture en cliquant et en passant leur souris sur les heures d'ouverture.

+-----------------------------+ 
| 0h 0h15m 0h30m ... 23:45 | 
+-----------------------------+ 

Quelqu'un a vu un tel widget de sélection personnalisable?

Vive

Répondre

1

Je recherche un widget curseur .. puis définissez les temps dont vous avez besoin que les intervalles.

L'interface utilisateur jQuery a un: jQuery UI Slider.

Mise à jour: basé sur le commentaire ci-dessous au sujet (un ou à double curseur) ...

1.) Theres un poste déjà (juste trouvé) de faire une 2 handled slider using the jQuery UI slider here.

Ou si vous avez 2 curseurs ... un pour l'heure d'ouverture et un pour la fermeture ... où chacun est décomposé en segments de 15min, mais seulement pour une demi-journée chacun, cela fonctionnerait-il?

par exemple. (Ignorer l'ASCII graphique laideur)

Open Time (AM): 12 1 2 3 4 5 6 7 8 | 9 10 11 12 
                 ^8:15am 

Close Time (PM): 12 1 2 3 4 5 6 | 7 8 9 10 11 12 
                ^6:30pm 

De plus, si cela est pour les entreprises « typiques » ... vous pourriez hachez probablement de 23 heures < -> 5 heures des curseurs.

Ou,

Je ne suis pas un grand fan de scriptaculous, mais ils semblent avoir un double slider:

+0

J'ai aussi réfléchi à cela, mais cela ne fonctionnerait pas vraiment car nous ne savons pas combien de régions il y a au départ. Par exemple. Une entreprise pourrait être ouverte de 8h à 10h, de 12h à 14h et de 18h à 20h. De plus, d'après ce que je comprends de la documentation, il semble y avoir un maximum d'une plage par curseur. Voici un exemple que j'ai trouvé avec des ticks: http://jsbin.com/iwime – javacoder

+0

Merci scunliffe, j'ai recours à cette solution pas si flexible, jusqu'à ce qu'un widget apparaisse! – javacoder

2

Google Calendar a nice one (vous pouvez le voir lorsque vous cliquez sur « Vérifier la disponibilité des ressources et des clients » sur la détails de l'événement formulaire). Mais je peux imaginer que ce serait difficile à cloner.

Google Calendar Time Ranage http://stuff.rajchel.pl/stackoverflow/GoogleCalendarTimeRange.jpg

+0

Merci pour la capture d'écran! C'est exactement ce que je cherche, sous une forme plus compacte. Je ne peux pas l'image, il n'existe pas déjà, par exemple. comme un widget jQuery enfichable. – javacoder

Questions connexes