dialogue scrollable dans jquery

Question

je suis en train de répliquer « DEMO 3 » dans cette page:

http://www.mudaimemo.com/p/simpledialog/

il fonctionne très bien, sauf que je suis remplir la liste des cases à cocher dynamique et parfois j'ai plusieurs cases que forme sur la page. est là de toute façon pour rendre ce scrollable donc il y a une taille maximale car en ce moment il sort juste de l'écran. Lorsque j'essaie d'ajouter une hauteur au javascript, la boîte est à la bonne hauteur, mais les cases à cocher continuent à descendre la page. comment puis-je conserver les cases à cocher dans le conteneur et avoir une barre de défilement verticale?

$(document).ready(function() { 
    $('#sdHc3').simpleDialog({ 
    showCloseLabel: false, 
     height: 400, 
     open: function() { 
      $('#checkboxStatus').html(''); 
     }, 
     close: function() { 
      var c = []; 
      $('#checkboxForm :checkbox:checked').each(function() { 
       c.push($(this).val()); 
      }); 
      $('#checkboxStatus').html('&nbsp;&nbsp;Checked <b>' + c.join(', ') + '</b>.').show(); 
     } 
    }); 

Answer 1

débordement: défilement;

dans le CSS pour le conteneur div, assurez-vous de définir une hauteur. Le problème avec ceci est que tous les navigateurs ne supportent pas max-height et donc votre div sera toujours de la même taille (ofc sauf si vous spécifiez chaque fois que vous avez besoin de cette fonctionnalité, une hauteur différente)

Dans votre fichier css (dans ce cas le faire dans le fichier css: jquery.simpledialog.0.1.css si vous ne l'avez pas renommer le fichier téléchargé):

.sd_container{ 
font-family: arial,helvetica,sans-serif; 
margin:0; 
padding: 10px; 
position: absolute; 
background-color: #fff; 
border: solid 1px #ccc; 
text-align:center; 
**overflow: scroll;** 
} 

(sans les étoiles OFC)

Answer 2

CSS:

#scrollableDiv 
{ 
    overflow: auto; 
    height: 549px;/* IE is dumb */ 
    max-height: 549px;/* Or the amount of pixels you want */ 
}