基于bootstrap点击图片放大插件

本文转载自查看原文 2020-05-27 10:10 2381 HTML5/ Bootstrap

        <!DOCTYPE html>
        <html>
        <head>
            <title></title>
            <!-- Introducing the bootstrap style css file-->
            <link href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
        </head>
        <body>
                <!-- demo image -->
                <img src="assets/img/demo1.jpg" width="400" class="viewer img-responsive"/>
        <!--Introduce the necessary js file-->
        <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
        <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.js"></script>
        <script src="dist/bootstrap.viewer.min.js"></script>
        <script type="text/javascript">
            $(function () {
                $('.viewer').bootstrapViewer();//The default image source file path is the src attribute of the img tag.
            })
        </script>
        </body>
        </html>

插件下载地址：http://bootstrap-viewer.leftso.com/

免责声明！

本站转载的文章为个人学习借鉴使用，本站对版权不负任何法律责任。如果侵犯了您的隐私权益，请联系本站邮箱yoyou2525@163.com删除。

猜您在找 点击图片放大预览插件 fancybox——图片点击放大插件移动端图片点击放大缩小（例如商品详情时）插件 vue-photo-preview插件实现点击图片放大组件 layui点击图片放大 jq点击图片放大 js点击图片放大点击图片实现图片放大： Bootstrap实现图片弹出放大 uniapp——点击图片放大预览