為什么海水這么咸？還不是因?yàn)槟銈冞@些城市人邊游泳邊小便??！

《插件推薦：download.js》

基于 Canvas，我們可以方便的對圖片進(jìn)行處理，比如，給圖片加個水印，在線做 Logo(體驗(yàn)地址：https://egoist.github.io/slogan)之類。

那圖片處理完，怎么下載？我以前的思路都是，將 Canvas 轉(zhuǎn)化成圖片，讓用戶右擊另存為，或者上傳到服務(wù)器，點(diǎn)下載按鈕下載。

用 download.js ，不需要傳服務(wù)器，就能下載。下面是用 Canvas 畫一個矩形，點(diǎn) Canvas 下載圖片的示例：

<canvas id="canvas" width="100" height="100"></canvas>
<script src="https://unpkg.com/downloadjs@1.4.6"></script>
<script>
  var canvas = document.querySelector('#canvas')
  var ctx = canvas.getContext('2d')
  ctx.fillStyle = 'yellow'
  ctx.fillRect(0, 0, 80, 80);
  canvas.addEventListener('click', function () {
    var image = canvas.toDataURL();
    download(image, 'slogan-download.png', 'image/png')
  })
  
</script>

插件官網(wǎng)：https://www.npmjs.com/package/download

《HTML5中手勢原理分析與數(shù)學(xué)知識的實(shí)踐》

背景

現(xiàn)代應(yīng)用越來越重視與用戶的交互及體驗(yàn)，手勢是最直接且最為有效的交互方式，一個好的手勢交互，能降低用戶的使用成本和流程，大大提高了用戶的體驗(yàn)。加之，移動屏一般都支持多點(diǎn)觸控，所以越來越多項(xiàng)目支持手勢。

概要

先介紹了需要的數(shù)學(xué)知識，然后介紹了常用手勢（拖動，雙指縮放，旋轉(zhuǎn)，單指縮放，旋轉(zhuǎn)）的具體實(shí)現(xiàn)。

閱讀地址：https://github.com/xd-tayde/blog/blob/master/html5-touch-math.md

再推薦個強(qiáng)大的手勢庫： Hammer.js。