javascript - What makes the Bootstrap modal tall or wide? -


i'm trying use jschr's bootstrap-modal fork allow various sized modals.

i cannot figure out why modals taller, wider, or otherwise sized.

here's documentation: http://jschr.github.io/bootstrap-modal/

here's super simplified jsfiddle: http://jsfiddle.net/4nrrr/

and relevant javascript:

$(function(){  $.fn.modalmanager.defaults.resize = true;  $('[data-source]').each(function(){   var $this = $(this),     $source = $($this.data('source'));    var text = [];   $source.each(function(){     var $s = $(this);     if ($s.attr('type') == 'text/javascript'){       text.push($s.html().replace(/(\n)*/, ''));     } else {       text.push($s.clone().wrap('<div>').parent().html());     }   });    $this.text(text.join('\n\n').replace(/\t/g, '    ')); });  }); 

and html

<div class="page-container">   <div class="container" style="position: relative">     <button class="demo btn btn-primary btn-large" data-toggle="modal" href="#long">view demo</button>   </div> </div>  <!-- modal definitions (tabbed on <pre>) --> <div id="long" class="modal hide fade" tabindex="-1" data-replace="true">   <div class="modal-header">     <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>     <h3>long modal</h3>   </div>   <div class="modal-body">     <img src="http://i.imgur.com/kwpyo.jpg" />   </div>   <div class="modal-footer">     <button type="button" data-dismiss="modal" class="btn">close</button>   </div> </div> 

it looks sized content in modal-body div. example, if replace

<div class="modal-body">   <img src="http://i.imgur.com/kwpyo.jpg" /> </div> 

with

<div class="modal-body">    <div style="height:100px; overflow:hidden;">       <img src="http://i.imgur.com/kwpyo.jpg" />    </div> </div> 

you shorter modal box.


Comments

Popular posts from this blog

node.js - Bad Request - node js ajax post -

Why does Ruby on Rails generate add a blank line to the end of a file? -

keyboard - Smiles and long press feature in Android -