Discussion :

[pouic06]

Bonjour les amis,

Je souhaiterais faire un datepicker un peu stylisé. Je m'inspire d'un autre site, il ressemble à ça :



Le code ressemble à cela :

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<div class="day_group_wrapper clearfix">
		<div class="day_group day_group_arrive">
			<label>Arrival</label>
			<div class="date_box" id="arrival">
				<div class="booking_arrow_icons"></div>
				<div class="ArriveMonth">November</div>
				<input class="day hasDatepicker" onfocus="this.blur()" readonly="" id="dp1543343621621">
				<div class="day_formatted" aria-disabled="true">28</div>
				<i class="flaticon-arrow-down"></i>
			</div>
		</div>
		<div class="day_group day_group_depart">
			<label>Departure</label>
			<div class="date_box">
				<div class="booking_arrow_icons"></div>
				<div class="DepartMonth">November</div>
				<input class="departday hasDatepicker" onfocus="this.blur()" readonly="" id="dp1543343621622">
				<div class="departday_formatted" aria-disabled="true">30</div>
				<i class="flaticon-arrow-down"></i>
			</div>
		</div>
	</div>

Grosso modo en cliquant n'importe où sur le petit panneau blanc où se trouve la date, s'ouvre le datepicker, lorsque l'on choisit la date, le petit panneau se met à jour.

J'ai pu copier le HTML et le CSS mais je sais pas du tout par où commencer avec le JS, d'où ce post.

Merci d'avance