[zebra datepicker] spostare posizione calendario

[metatad]

Se qualcuno conosce questo calendario (zebra datepicker) mi servirebbe sapere come spostare la posizione del calendario rispetto al campo di input.
Di default, lo posiziona in modo tale che il margine inferiore corrisponde al margine inferiore del campo di input, a cui quindi risulta allineato. Poichè nel mio caso i campi di input sono molto in alto nella pagina, vorrei poter far si che il calendario risultasse allineato col margine superiore dei campi input.
(vedi immagine sotto)
Senza-titolo-1.jpg
Non sono riuscito a trovare i parametri di posizionamento...
Grazie in anticipo per l'aiuto

[m4rko80]

Ciao, QUI il parametro per posizionare sotto pare sia "default_position" per default settato ad above ma settabile a below.
Se non funziona nemmeno così guarda il css generato e sovrascrivilo magari.

[metatad]

Thanx!

[metatad]

Come da indicazioni della pagina How to use, ho impostato il parametro default_position:

<input name="checkin" type="text" id="checkin" size="16" data-zdp_default_position="below" class="input" style="width:110px" />

Però continua ad allinearmelo in alto!

[m4rko80]

Strano, mi pare corretto. C'e' scritto che in automatico comunque setta la posizione in base al viewport.
Hai provato a settare da JS (giusto per prova)? Se non funziona prova a vedere da css cosa succede e magari forzarlo

[metatad]

Il posizionamento in base al viewport funziona, nel senso che il calendario viene abbassato quel tanto che serve per farlo stare dentro la finestra.
Ho provato a settarlo da JS, così:

$('#checkin').Zebra_DatePicker({        direction: ['2014-09-24', '2014-10-12'];    default_position: 'below';    });

aggiungendo la riga default_position: 'below';
ma anche in questo caso non funziona...
Da CSS non saprei come fare, perchè la classe, rispetto al posizionamento, ha il solo attributo position:absolute; mentre per il resto viene settato direttamente dal file JS...
Cercando lì, mi sembra che questa sia la sola parte di codice che possa essere riferita al posizionamento:

q.addClass("Zebra_DatePicker_Icon_Inside");l=d.outerWidth();K=d.outerHeight();s=parseInt(d.css("marginLeft"), 10)||0;var b=parseInt(d.css("marginTop"),10)||0,A=q.outerWidth(),pa=q.outerHeight(),xa=parseInt(q.css("marginLeft"),10)||0,ya=parseInt(q.css("marginRight"),10)||0;a.settings.inside?q.css({top:b+(K-pa)/2,left:s+(l-A-ya)}):q.css({top:b+(K-pa)/2,left:s+l+xa})}void 0!==q

ma non saprei come intervenirci...

[m4rko80]

Fra un opzione l'altra non ci va il punto e virgola. Ci va una virgola visto che è un object / lista di chiavi e valori come da esempio:
$('#datepicker-example3').Zebra_DatePicker({
direction: true,
disabled_dates: ['* * * 0,6']
});

[metatad]

Purtroppo nemmeno così va...

$('#checkin').Zebra_DatePicker({
direction: ['2014-12-22', '2014-12-27'],
default_position: 'below'
});

[m4rko80]

Ho provato scaricando lo zip ed editando la demo index html per example1 e funziona.
Non vorrei ci sia altro nel sito che conflitta

[metatad]

Si, adesso ho provato anch'io e funziona... ma allora cosa accidenti può essere, non lo capisco!
Nella pagina non ci sono altre funzioni JQuery, non ci sono altri elementi con lo stesso id...
???