如何调整和动画Twitter的引导2模式窗口？

Question

我想问一问，是否有人能给我一些想法，以动态调整一个减震器2模式窗口，动画效果顺利。

我正在考虑让它像彩色盒一样工作，当模态的内容发生变化时，它会根据内容的尺寸改变它的宽度和高度。

Answer 1

什么应该触发调整尺寸？看这里：https://stackoverflow.com/a/245011/1596547，你可以用这个来调整你的模式。请参阅：http://bootply.com/71672

有关Twitter的引导程序3，请参见：https://stackoverflow.com/a/18042644/1596547

html

<div class="container">
<!-- Button to trigger modal -->
<a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a>

<!-- Modal -->
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">X</button>
    <h3 id="myModalLabel">Modal header</h3>
      </div>
  <div class="modal-body">
      <!--long text--><a href="#" id="resize">Resize</a>
 </div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
    <button class="btn btn-primary">Save changes</button>
  </div>
</div>

</div>

javascript

$('#resize').click(function(){$("#myModal").animate({width:"200px"},600,'linear');});

保持模态位置中心为

居中位置由.modal类的一个负的左边距设置.这个负左边距的值将是模态宽度的一半.因此，在调整大小时，要将位置保持为中心，请尝试如下所示：

    $("#myModal").animate({"width":"200px","margin-left":"-100px"},600,'linear');

地役权

jQuery内核附带两个附加条件:线性(在整个动画中以恒定的速度前进)和swing (jQuery核心的默认宽松)，它在动画的开始和结束时比在动画的中间稍微慢一些。

jQuery UI提供了几个额外的简化功能(请参阅：http://api.jqueryui.com/easings/ )

或者这个插件：http://gsgd.co.uk/sandbox/jquery/easing/参见：http://easings.net/