jQuery Italia - Forum » Supporto ed Aiuto » Problemi con jQuery UI

problemi con datepicker: z-index

(6 articoli)

  1. raptus257
    Membro

    salve, sono nuovo del forum quindi un saluto a tutti, avrei un problema che non riesco a risolvere con il datepeaker ui di jquery; il fatto è che nel mio sito uso già un plug-in per una galleria di immagini che assega ad ognuna di queste uno z-index piu alto in modo da farle visualizzare a turno. La quesione si crea quando apro il calendarietto del datepeacker e questo, siccome gli viene assegnato un valore z-index fisso non modificabile dal css, mi và a finire sotto la galleria delle immagini rimanendo in parte coperto. Ho cercato di modificare il javascript del plugin ma non essendo programmatore non sò dove mettere le mani; Qualche idea su come risolvere?

    Pubblicato 1 year fa #

  2. jqueryitalia
    Amministratore

    Ciao raptus257 e benvenuto!!!

    Il datepicker dovrebbe avere un foglio stile di default: quindi dovrebbe essere sufficiente settare lo z-index del div con class "ui-datepicker" ad un valore più alto di quello che viene settato per le immagini.

    Se ciò non bastasse ti consiglio ti seguire il consiglio che trovi in questa pagina http://www.west-wind.com/weblog/posts/891992.aspx dove viene utilizzato il plugin maxZIndex. Alla fine dell'articolo trovi le istruzioni da applicare al datepicker.

    Pubblicato 1 year fa #

  3. raptus257
    Membro

    ho seguito il tuo consiglio ed ho cercato di utilizzare il plug-in maxZIndex, pero non funziona ugualmente :-(
    Ho inserito il seguente codice nell'head della pagina:

    <script>
    $.maxZIndex = $.fn.maxZIndex = function(opt) {
    /// <summary>
    /// Returns the max zOrder in the document (no parameter)
    /// Sets max zOrder by passing a non-zero number
    /// which gets added to the highest zOrder.
    /// </summary>
    /// <param name="opt" type="object">
    /// inc: increment value,
    /// group: selector for zIndex elements to find max for
    /// </param>
    /// <returns type="jQuery" />
    var def = { inc: 10, group: "*" };
    $.extend(def, opt);
    var zmax = 0;
    $(def.group).each(function() {
    var cur = parseInt($(this).css('z-index'));
    zmax = cur > zmax ? cur : zmax;
    });
    if (!this.jquery)
    return zmax;

    return this.each(function() {
    zmax += def.inc;
    $(this).css("z-index", zmax);
    });
    }

    jQuery('#txtDate').datepicker({ showButtonPanel: true,
    showOn: 'button',
    buttonImageOnly: true,
    buttonImage: '/wconnect/images/calendar.gif',
    beforeShow: function() {$('#ui-datepicker-div').maxZIndex(); },
    dateFormat: 'mm/dd/yy' }).attachDatepickerInputKeys();
    </script>

    forse devo cambiare qualcosa? il codice va inserito in qualche alta parte?

    Pubblicato 1 year fa #

  4. jqueryitalia
    Amministratore

    Che verisone di jQueryUI stai utilizzando?
    La pagina è visibile in rete? Se si puoi darmi l'indirizzo?

    Pubblicato 1 year fa #

  5. raptus257
    Membro

    la pagina è questa: http://www.bbvillaangela.it/; per adesso finche non risolvo ho abbassato il div delle prenotazioni anche se adesso sto facendo qualche prova

    Pubblicato 1 year fa #

  6. raptus257
    Membro

    Ragazzi ho risolto!!! ho apero il file .js del datepicker (jquery.ui.datepicker.js), qui mi sono andato a trovare la riga di codice dove viene assegnato lo z-index ad un valore di 1:

    inst.dpDiv.zIndex($(input).zIndex()+1);

    e non ho fatto altro che cambiare il valore ad 8:

    inst.dpDiv.zIndex($(input).zIndex()+8);

    poi siccome nella galleria che sto usando lo z-index delle immagini ha un valore massimo di 7 il gioco è fatto!

    Spero che questo articolo possa aiutare altri perche ho visto anche nei forum esteri che questo è un problema abbastanza diffuso.

    un saluto a tutti, alla prossima

    Pubblicato 1 year fa #

RSS feed for this topic

Replica

Devi aver fatto il login per poter pubblicare articoli.