需求:商品列表中圖片點選放大。

實現方法:使用viewer.js外掛，實現點選圖片圖片放大

做法:

1.下載viewer.js外掛

2.頁面上引入相關的外掛

<link rel="stylesheet" href="../js/viewer/viewer.min.css"/>
<script type="text/javascript" src="../js/viewer/viewer.min.js"></script>

3.初始化外掛

    比如我想放大檔案中這些圖片

 如何初始化外掛:

頁面對應的js中新增:$('.viewer').viewer();

如果你想放大之後更換圖片，可以對應的img標籤中新增屬性:data-original="newurl"

引數值是你放大之後展示的新的圖片地址，初始化:

$('#viewer').viewer({url:"data-original"});

實現的效果:

 希望對你有所幫助，如果你想做web應用系統或者程式私聊我哦