jQuery UI è utile, ma molti dei suoi widget soffrono di un fastidioso bug di progettazione. Se non si ha a che fare con le finestre modali, non si avrà nemmeno l’esperienza, ma se si tenta di utilizzare una funzione di completamento automatico o un widget datepicker all’interno di una finestra modale, troverete un

generato dinamicamente dietro il modale.

z-index e modals
⤽
Si potrebbe provare a codificare un z-index elevato per compensare questo, ma non è per niente flessibile, soprattutto all’interno di un complesso di modelli terze parti.
È per questo che si usa questo frammento di codice negli eventi open (autocomplete) o beforeShow (date picker), acquisito da fonti che non ricordo dove, per risolvere il problema.
function(input, inst) {
  var zMax = 1;
  $(input).parents().each(function(){
    zMax = Math.max(zMax, $(this).css('z-index'));
  });

  setTimeout(
    function() {
      $('.ui-datepicker .ui-autocomplete').css('z-index', zMax + 1);
    },
    300
  );
}
Purtroppo, l’uso di setTimeout() è necessario, perché l’evento viene generato prima che il codice venga aggiunto al DOM. Possiamo accorciare l’intervallo fino a circa 150 ms, ma a volte può fallire su macchine lente che usano IE.
Similari
⋮ Fondamentali di jQuery ⋮
265% JQuery ⊚
jQuery stà diventando rapidamente uno strumento che ogni sviluppatore web di interfacce dovrebbe conoscere. Lo scopo di questo libro è di fornire una panoramica della biblioteca, in modo che qu…
⋮ Python per tutti ⋮
125% Python ⊚
Python para todos è un libro sulla programmazione in Python. Questo è un tutoriale su Python adatto a tutti i livelli e si può scaricare in pdf gratuitamente in spagnolo. Il tutoriale di Python…
⋮ Guida allo Zend Framework ⋮
107% Zend ⊚
Zend Framework è un framework open source per PHP. Zend Framework separa la logica e le azioni usando il pattern MVC (Model View Controller). Cosa è lo Zend Framework? Framework per la costruzione di siti web più veloci e …
⋮ Cos’è this? ⋮
41% JQuery ⊚
Uno degli aspetti più confusi di jQuery è come assegna l’ambito durante il callback. Deve essere parecchio confuso perché l’argomento genera un sacco di domande sulla mailing list di jQuery. Peccato, davvero, perché jQuery…
⋮ Precaricare immagini ⋮
24% JScript ⊚
La precarica delle immagini è un ottimo modo per migliorare la user experience. Quando le immagini sono precaricate nel browser, il visitatore può navigare ovunque nel nostro sito e disporre di tempi di caricamento più vel…

Aggiungi un commento

Questo sito usa Akismet per ridurre lo spam. Scopri come i tuoi dati vengono elaborati.