前言：本人對hammer了解不是很多，早做專案時遇到了手機端的一些滑動事件，特此分析下hammer的某些屬性。
hammer.js是一款開源的移動端指令碼框架，他可以完美的實現在移端開發的大多數事件，如：點選、滑動、拖動、多點觸控等事件。hammer.js不需要依賴任何其他的js框架，並且整個框架非常小，v2.0.4版本只有3.96kb。
可直接引入檔案，也可以引入cdn位址。在這裡，為了方便，我引入了jquery框架。
>
hammer的事件繫結方法是新建乙個hammer物件，並傳入要操作的dom，必須使用原始dom，即使用這兩種方法獲取dom。
var hammerobj=new hammer(document.getelementbyid('main'));
var hammerobj=new hammer($('#main').get(0));
主要支援在當前dom區域內的乙個手指放下並移動事件，即螢幕滑動事件，其中包括左滑動、右滑動、上滑動、下滑動，該事件還可以對以下事件進行監聽或處理：
panstart：拖動開始、panmove：拖動過程、panend：拖動結束、pancancel：拖動取消、panleft：向左拖動、panright：向右拖動、panup：向上拖動、pandown：向下拖動
panstart事件
會在event物件中輸出滑動開始的座標
panmove事件
一次滑動會觸發多次panmove事件，會在direction中輸出方向，當direction等於16時，為向下滑動，當direction等於8時，為向上滑動，當direction等於4時，為向右滑動，當direction等於2時，為向左滑動。
panend事件
滑動結束，一次滑動只會執行一次，同樣在direction中輸出方向，當direction等於16時，為向下滑動，當direction等於8時，為向上滑動，當direction等於4時，為向右滑動，當direction等於2時，為向左滑動。
pancancel事件
滑動取消，不知道何時觸發。
panleft事件
向左滑動，一次滑動多次觸發，其中垂直上下滑動不會觸發，滑動時向左有一定偏移量的時候會觸發。
panright事件
向右滑動，一次滑動多次觸發，其中垂直上下滑動不會觸發，滑動時向右有一定偏移量的時候會觸發。
panup事件
向上滑動，一次滑動多次觸發，其中水平左右滑動不會觸發，滑動時向上有一定偏移量的時候會觸發。
pandown事件
向下滑動，一次滑動多次觸發，其中水平左右滑動不會觸發，滑動時向下有一定偏移量的時候會觸發。
主要支援在當前dom區域內的多個手指（預設兩個手指，多個手指需要單獨設定）的相對移動和相向移動，該事件還可以對以下事件進行處理或者監聽：
pinchstart：多點觸控開始、pinchmove：多點觸控過程、pinchend：多點觸控結束、pinchcancel：多點觸控取消、pinchin：多點觸控時兩手指距離越來越近(縮小)、pinchout：多點觸控時兩手指距離越來越遠（放大），其觸發事件如pan事件。
var hammertime = new hammer(document.getelementbyid("body"));
hammertime.add(new hammer.pinch());
hammertime.on("pinchin", function (e) );
主要支援在當前的dom區域內觸屏版本的點選事件，這個事件相當於pc端的click事件，該不能包含任何的移動，最小按壓時間為500毫秒，常用於我們在手機上用的「複製、貼上」等功能，該事件分別對以下事件進行監聽並處理：
pressup：按壓事件離開時觸發
該事件不存在pressdown事件，具體是否支援按壓開始未知。
rotatestart：旋轉開始、rotatemove：旋轉過程、rotateend：旋轉結束、rotatecancel：旋轉取消
主要支援在當前的dom區域內，乙個手指快速的在觸屏上滑動。即我們平時用到最多的滑動事件。
swipeleft：向左滑動、swiperight：向右滑動、swipeup：向上滑動、swipedown：向下滑動
該事件只有在垂直上下滑動或水平左右滑動時觸發，即滑動時如果傾斜太大角度則不會觸發，觸發條件比較苛刻。
主要支援在當前的dom區域內，乙個手指輕拍或點選時觸發該事件(類似pc端的click)。該事件最大點選時間為250毫秒，如果超過250毫秒則按press事件進行處理。
預設情況下pinch和rotate事件是被禁止的，可以通過以下**開啟它。
hammertime.get('pinch').set();
hammertime.get('rotate').set();
一般情況下，瀏覽器是禁止螢幕上滑下滑事件的，因為瀏覽器預設的是上下滑動滾動頁面，若要允許識別器識別垂直方位或全部方位的 pan 和 swipe，可以這麼寫：
hammertime.get('pan').set();
hammertime.get('swipe').set();
另建議加上如下meta標籤，防止doubletap 或 pinch 縮放了viewport：
在滑動事件執行後，我們一般會執行乙個函式或者對dom進行操作，hammer事件多次執行，有時候會使函式多次執行或多次dom操作，由於我現在做的專案滑動之後執行的操作是需要一段時間的，所以採用設定乙個全域性變數作為函式執行開關的方法進行阻止，hammer應該提供了自己的方法，但我還不知道，望知道的小夥伴可以告訴我。
1但是這種方法只有在滑動後執行函式或操作存在一定時間才可以，比如alert()換成console.log（）就會多次輸出，沒有辦法解決這個問題。
其實pan事件我們完全不需要使用panmove來實現，可以採用panend,同樣可以輸出不同方向然後進行判斷，但pinchin（捏合）事件同樣會多次執行，所以新的方法還需要尋找。。。
web移動端專案初始化
cnpm i vant s 在main.js中載入註冊 vant 元件 import vue from vue import vant from vant import vant lib index.css vue.use vant vant中的樣式預設使用px作為單位，如果需要使用rem lib ...
關於初始化及初始化順序
首先，類的成員變數會被自動初始化，並且會在構造器被呼叫前發生，如下 public class testinitialization public static void main string args 如下 主類 public class staticinitialization 呼叫main之前...
移動端布局初始化以及注意事項
方案 採取單獨製作移動端頁面 與pc端分開 技術 布局採用流式布局 百分比 css 用來放css檔案 images 用來放 upload 用來放一些經常會換的，後期容易維護 index 首頁 首頁html檔案 使用時可直接將此段 複製在文字當中 name viewport content width...