Como seu conteúdo deve ser dinâmico, você pode definir as propriedades css do modal dinamicamente no showevento do modal, que redimensionará o modal substituindo suas especificações padrão. O motivo de ser bootstrap aplica-se a altura máxima ao corpo modal com a regra css conforme abaixo:
.modal-body {
position: relative;
overflow-y: auto;
max-height: 400px;
padding: 15px;
}
Portanto, você pode adicionar estilos embutidos dinamicamente usando o cssmétodo jquery :
Para versões mais recentes do uso de bootstrap show.bs.modal
$('#modal').on('show.bs.modal', function () {
$(this).find('.modal-body').css({
width:'auto', //probably not needed
height:'auto', //probably not needed
'max-height':'100%'
});
});
Para versões mais antigas do uso de bootstrap show
$('#modal').on('show', function () {
$(this).find('.modal-body').css({
width:'auto', //probably not needed
height:'auto', //probably not needed
'max-height':'100%'
});
});
ou use uma regra css para substituir:
.autoModal.modal .modal-body{
max-height: 100%;
}
e adicione esta classe autoModalaos seus modais de destino.
Altere o conteúdo dinamicamente no fiddle, você verá o modal sendo redimensionado de acordo. Demo
A versão mais recente do bootstrap consulte o disponível event names.
- show.bs.modal Este evento é disparado imediatamente quando o método show instance é chamado. Se causado por um clique, o elemento clicado fica disponível como a propriedade relatedTarget do evento.
- mostrado.bs.modal Este evento é disparado quando o modal torna -se visível para o usuário (irá aguardar a conclusão das transições CSS). Se causado por um clique, o elemento clicado fica disponível como a propriedade relatedTarget do evento.
- hide.bs.modal Este evento é disparado imediatamente quando o método de instância ocultar é chamado.
- hidden.bs.modal Este evento é disparado quando o modal termina de ser escondido do usuário (irá aguardar a conclusão das transições CSS).
- carregado.bs.modal Este evento é disparado quando o modal carrega o conteúdo usando a opção remota.
Versão mais antiga do bootstrap modal events compatível.
- Show - Este evento é disparado imediatamente quando o método de instância show é chamado.
- mostrado - Este evento é disparado quando o modal torna-se visível para o usuário (irá aguardar a conclusão das transições css).
- hide - Este evento é disparado imediatamente quando o método de instância hide é chamado.
- oculto - Este evento é disparado quando o modal termina de ser oculto do usuário (irá aguardar a conclusão das transições css).
