adattare l'elemento di un form allo schermo

[wandaground]

Ciao a tutti,
ho un form d'iscrizione in php e js con la possibilità di compilare tutti i campi richiesti e in più di selezionare la propria data di nascita da un piccolo calendario.
Mi chiedevo se fosse possibile aprire questo calendario come nelle gallery lightbox.
Fin'ora ogni mio tentativo è andato in vano.
Questo è il codice del box in questione:

<div class="grid half">   
                 <input type="text" name="birthday" id="birthday" placeholder="Data di nascita" readonly>  

                                          <!--calendar-->                        
<div class="calendar">                                               
 <div class="selector">                       
 <input type="text" name="month" class="month" placeholder="Mese" readonly>         
               <ul>                 
       <li>Gennaio</li>                       
 <li>Febbraio</li>                        
<li>Marzo</li>                        
<li>Aprile</li>                        
<li>Maggio</li>                        
<li>Giugno</li>                        
<li>Luglio</li>                       
 <li>Agosto</li>                        
<li>Settembre</li>                        
<li>Ottobre</li>                        
<li>Novembre</li>                        
<li>Dicembre</li>                       
 </ul>                        
</div>                                               

 <div class="selector">                        
<input type="text" name="day" class="day" placeholder="D&igrave" maxlength="2" readonly>                        <ul>                       
 <? for($gg=1;$gg<32;$gg++) {                            
if($gg<10){                                
echo "<li>0$gg</li>";                           
 }                           
 else {                               
 echo "<li>$gg</li>";                            
 }                        
}                       
 ?>                        
</ul>                       
 </div>                                             
   <div class="selector">                      
  <input type="text" name="year" class="year" placeholder="Anno" maxlength="4" readonly >                        <ul>                        
<? for($aa=1920;$aa<2001;$aa++) {                                
echo "<li>$aa</li>";                             
}                        ?>                        
</ul>                        
</div>                                               
 <div class="done_calendar"><i class="fa fa-check"></i></div>
                        </div>                        
<!--end calendar-->                                           
 </div>                  

E' possibile? Spero che qualcuno possa aiutarmi.
Grazie!!!

[Alhazred]

Sono cose che si fanno in Javascript, magari usando jQuery, non in PHP.
Sposto.

[wandaground]

Ah, ok. Mi scuso e ringrazio.

[cavicchiandrea]

http://jqueryui.com/datepicker/

[wandaground]

Forse non mi sono spiegata: il calendario funziona perfettamente e non è questo il problema.
Io vorrei semplicemente che il calendario si apra come un pop up delle gallery lightbox, quindi centrato rispetto a qualsiasi risoluzione di schermo. Spero di essere stata più chiara.
Grazie anticipatamente.

[cavicchiandrea]

Forse non mi sono spiegata: il calendario funziona perfettamente e non è questo il problema.
Io vorrei semplicemente che il calendario si apra come un pop up delle gallery lightbox, quindi centrato rispetto a qualsiasi risoluzione di schermo. Spero di essere stata più chiara.
Grazie anticipatamente.

Se non funziona inserendo il calendario direttamente nel lingtbox, bisogna che ti studi quest'ultimo per adattarlo alle tue esigenze

[wandaground]

Grazie Andrea, il problema è che di javascript ne capisco poco....
E poi il calendario non è un'immagine, per cui non saprei come adattarlo alle mie esigenze. Mi sa che non è una cosa semplicissima

[cavicchiandrea]

Grazie Andrea, il problema è che di javascript ne capisco poco....
E poi il calendario non è un'immagine, per cui non saprei come adattarlo alle mie esigenze. Mi sa che non è una cosa semplicissima

Ne più ne meno delle cose che non si conoscono, vedi se migrando a francybox risolvi

[lucavizzi]

Ciao wandaground,
Questo esempio apre "il calendario" al click su di un link.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Calendario</title>
<style type="text/css">
#calendar{
 display:none;
}
</style>
<script type="text/javascript" src="lib/jquery-1.10.1.min.js"></script>
<script type="text/javascript" src="source/jquery.fancybox.js?v=2.1.5"></script>
<link rel="stylesheet" type="text/css" href="source/jquery.fancybox.css?v=2.1.5" media="screen" />
<script type="text/javascript">
$(function(){
 $('#openCalendar').fancybox();
});
</script>
</head>
<body>
<a href="#calendar" id="openCalendar">Apri calendario</a>
<div id="calendar">
 <h3>Calendario</h3>
   <p>Qui ci va l'HTML del tuo calendario</p>
</div>
</body>
</html>

Puoi scaricare i file inclusi qui:
https://codeload.github.com/fancyapp...acy.zip/v2.1.5

Luca