99久久国产综合精品女图图等你 ,chinese熟女熟妇1乱老女人

国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

viewer-- A simple jQuery image viewing plugin.
Viewer v0.5.1
Viewer.js – 強大的JS/jQuery圖片查看器
根據(jù)以上資料自己做了個demo。
由于工作需要，要在bootstrap的modal層里應(yīng)用viewer，遇到的問題是：
在modal層里應(yīng)用viewer無法居中，如圖：

ps:這個modal層相對較長.

ps:不顯示在modal層中時是正常的，如下圖：

請問，該如何設(shè)置使預(yù)覽放大的照片在modal內(nèi)居中？

代碼：jsfiddle 點擊查看（注：viewer的效果沒有，在線調(diào)試中引入的文件不起作用）

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>viewer.js圖片查看器插件</title>
    <link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="plugin/viewer/css/viewer.css">
</head>

<body>
    <span id="btn" class="btn btn-default" data-title="add"><i class="fa fa-minus-square"></i> 彈框</span>
    <div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" data-backdrop="static" data-keyboard="false">
        <div class="modal-dialog modal-lg" role="document">
            <div>
                <div>
                    <button type="button" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 id="myModalLabel"><i class="fa fa-pencil-square-o"></i> 圖片上傳</h4>
                </div>
                <div>
                    <ul id="docs-pictures">
                        <li>
                            <div> <img data-original="img/hgtrh.jpg" src="img/thumbnails/hgtrh.jpg"></div>
                        </li>
                        <li><img data-original="img/imagfrefrewfes (3).jpg" src="img/thumbnails/imagfrefrewfes (3).jpg"></li>
                        <li><img data-original="img/20160918105709.jpg" src="img/thumbnails/20160918105709.jpg"></li>
                        <li><img data-original="img/fewfef.jpg" src="img/thumbnails/fewfef.jpg"></li>
                        <li><img data-original="img/apic14052.jpg" src="img/thumbnails/apic14052.jpg"></li>
                        <li><img data-original="img/images (2).jpg" src="img/thumbnails/images (2).jpg"></li>
                        <li><img data-original="img/vfegvreg.jpg" src="img/thumbnails/vfegvreg.jpg"></li>
                        <li><img data-original="img/images.jpg" src="img/thumbnails/images.jpg"></li>
                        <li><img data-original="img/20160918132119.jpg" src="img/thumbnails/20160918132119.jpg"></li>
                    </ul>

                </div>
                <div>
                    <button type="button" class="btn btn-default" data-dismiss="modal"><i class='fa fa-times'></i> 關(guān)閉</button>
                </div>
            </div>
        </div>
    </div>

    <ul id="pictures">
        <li>
            <div> <img data-original="img/hgtrh.jpg" src="img/thumbnails/hgtrh.jpg"></div>
        </li>
        <li><img data-original="img/imagfrefrewfes (3).jpg" src="img/thumbnails/imagfrefrewfes (3).jpg"></li>
        <li><img data-original="img/20160918105709.jpg" src="img/thumbnails/20160918105709.jpg"></li>
        <li><img data-original="img/fewfef.jpg" src="img/thumbnails/fewfef.jpg"></li>
        <li><img data-original="img/apic14052.jpg" src="img/thumbnails/apic14052.jpg"></li>
        <li><img data-original="img/images (2).jpg" src="img/thumbnails/images (2).jpg"></li>
        <li><img data-original="img/vfegvreg.jpg" src="img/thumbnails/vfegvreg.jpg"></li>
        <li><img data-original="img/images.jpg" src="img/thumbnails/images.jpg"></li>
        <li><img data-original="img/20160918132119.jpg" src="img/thumbnails/20160918132119.jpg"></li>
    </ul>
    <script type="text/javascript" src='js/jquery-2.0.2.min.js'></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="plugin/viewer/js/viewer.js"></script>
    <script>
        $('#docs-pictures,#pictures').viewer();
        $('body').on('click', '#btn', function () {
                $('#modal').modal('show');
        });
    </script>
</body>

</html>

ps:頁面效果不好看，請自行忽略