svg是一種不錯的矢量圖,有時候我們會使用這樣的圖片來作為展示圖,因為它不會因為放大縮小而失真。
好了,不扯淡了,廢話少說,直入主題吧。
首先確定你是要深入學習還是要簡單的把遇到的小任務解決一下,以后都很少會接觸,顯然,大家基本都是偶爾一次是吧。
那么我將告訴你最簡單的方式。
鏈接:http://timmywil.github.io/jquery.panzoom/demo/ 相信你要的應該在這里面的demo里面。
這里注意,我們寫代碼,可以用輪子,但是我們應該注重底層基本原理,及其實現的大概。
那么,現在我們看下它縮放的基礎是什么》》》 鏈接:http://www.html-js.com/article/SVGkaifayuyingyong-SVG-jibenzhishiSVG-fangdasuoxiaozhi-viewbox-chutan-1%203785
看完了,回到這里,這時候我們明白,所謂的放大縮小其實是設置svg的viewbox
看完你會覺得如此簡單,但是,我們是不是該考慮一下這個viewbox到底是什么??
其實,我想這時候你如果思考的話,應該不難思考到,其實就是圖片的大小控制,其實一直都是在對svg外圍的div控制,這樣控制圖片的大小。