北京网帮你
bootstrap 3.3.5 modal模态框垂直居中已解决(例子)
时间:2016-01-27 23:39:59 浏览:582


       bootstrap 3.3.5 modal模态框垂直居中已解决

<button class="btn btn-primary" data-toggle="modal" data-target="#myModal">
测试
</button>


<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"

aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
<input id="productimg" name="productimg[]" type="file" multiple=true class="file-loading">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
<!-- /.modal -->
</div>
<script>
$(function () {
$("[data-toggle='modal']").click(function () {
var _target = $(this).attr('data-target')
t = setTimeout(function () {
var _modal = $(_target).find(".modal-dialog")
_modal.animate({'margin-top': parseInt(($(window).height() - _modal.height()) / 2)}, 300)
}, 200)
})


})

</script>

加上这个就OK了

[上一篇]Laravel 5 教程学习笔记Session::
[下一篇]实用的免费发布分类信息的网站
Copyright 2022 © 93580.com.cn 网帮你

2022 © 版权所有 红花岗区网帮你信息技术工作室

工信部备案号:黔ICP备2024036985号-2

请使用网帮你微信扫码登录