2016 Technology

rem 62.5%在chrome谷歌和其餘瀏覽器不同

http://www.5imoban.net/jiaocheng/div+css/201512191529.html

http://blog.csdn.net/phunxm/article/details/42174937/

淘寶彈性佈局方案lib-flexible實踐 http://www.cnblogs.com/lyzg/p/5058356.html

 手機淘寶的flexible設計與實現 http://www.html-js.com/article/2402

從網易與淘寶的font-size思考前端設計稿與工做流 http://www.cnblogs.com/lyzg/p/4877277.html

 

JQurey各類版本：http://www.jq22.com/jquery-info122

 

web app變革之rem http://isux.tencent.com/web-app-rem.html

http://www.responsive.cn/

Case:http://www.eecc.com.cn/

 

佈局自適應
自適應，包括基於媒體查詢的px佈局，百分比佈局，rem佈局。
其中手機淘寶的rem佈局方案，頗有實踐價值。
http://www.html-js.com/article/2402

觸摸手勢
業內成熟方案有
百度的touch.js
http://touch.code.baidu.com/
以及國外的hammer.js
http://hammerjs.github.io/

輪播圖
用過bug最少的就是iSlider了
http://be-fe.github.io/iSlider/

局部滾動和下拉刷新
淘寶的xscroll和國外的iscroll

單頁面（基於狀態的路由）
張鑫旭有一個mobilebone.js
http://www.mobilebone.org/

 

又一個單頁滾屏組件：pageSwitch.js  http://www.qiqiboy.com/post/65

學習16：css3 flex流動自適應響應式佈局設計 http://qianduanblog.com/post/css-learning-16-css3-flex-responsive-design.html

學習18：css3 flex流動自適應響應式佈局實例 http://qianduanblog.com/post/css-learning-18-css3-flex-responsive-design-example.html

http://qianduanblog.com/post/css-learning-19-css3-flex-responsive-design-class.html

 

 

iScroll官方 http://cubiq.org/iscroll-4 http://cubiq.org/dropbox/iscroll4/examples/simple/

iScroll.js的用法  http://www.cnblogs.com/asqq/archive/2012/04/23/2466132.html

iScroll.js 用法參考 （share）  http://www.cnblogs.com/duanhuajian/archive/2013/04/08/3008323.html

 http://blog.csdn.net/albert528108/article/details/41803011

iscroll.js結合appcan實現上拉加載下拉刷新的效果  
http://blog.sina.com.cn/s/blog_a0d0fbbd0102uydu.html   http://blog.sina.com.cn/s/blog_a5d3b8fd0102vgq1.html

使用iScroll時，input等不能輸入內容的解決方法  http://www.cnblogs.com/duanhuajian/archive/2012/11/09/2763159.html 

移動端rem自適應佈局關鍵代碼

function resi() {

     var  html = document.querySelector( "html" );

     var  wW = document.body.clientWidth || document.documentElement.clientWidth;

     var  maxW = 640;

     var  minW = 320;

     if  (wW > maxW) wW = maxW;

     var  ratio = wW / minW;

     html.style.fontSize = 50 * ratio +  "px"

}

window.addEventListener( "DOMContentLoaded" ,  function () {

     var  bodys = document.querySelector( "body" ).style;

     bodys.opacity =  "1" ;

     bodys.filter =  "alpha(opacity=100)" ;

     resi()

});

window.addEventListener( "resize" , resi);

 

基礎http://blog.csdn.net/kongjiea/article/details/17092413

 jQuery Ajax 實例 ($.ajax、$.post、$.get) http://jun1986.iteye.com/blog/1399242

HTML5實戰——svg學習 http://www.cnblogs.com/duanhuajian/p/3227410.html

jquery函數大全 https://www.douban.com/note/218884397/ 

 

 

 

CSS print 樣式   http://www.admin10000.com/document/5933.html(不支持低版本IE)   
jquery.printPage.js，將想要打印的頁面加載到iframe中，並打印它http://www.css88.com/archives/3014
http://blog.jobbole.com/44662/       CSS控制print打印樣式  http://blog.csdn.net/pangni/article/details/6224533

 

百度判斷客戶端是手機仍是PC的方法  http://yuncode.net/code/c_57635d576b37762

 

騰訊isux：使用SVG中的Symbol元素製做Iconhttp://isux.tencent.com/16292.html
上哪找svg圖標去呢？ 這裏推薦去icomoon.io 這個專門提供矢量圖標網站下載矢量圖像，重要的是它提供SVG格式的圖形下載。

Snap.svg – 現代 Web 開發必備的 JavaScript SVG 庫(snap.svg-min.js)

　SVG 是一種很好的 Web 技術方案，能夠用來建立互動，在任何大小的屏幕上都會很好看、與分辨率無關的矢量圖形。而這裏推薦的 Snap.svg 這個 JavaScript 能夠讓你像 jQuery 操做 DOM 同樣操做 SVG 資源。
　Snap.svg 是專爲現代瀏覽器打造，支持剪裁，遮罩，紋理，漸變，分組等功能。憑藉豐富的動畫庫和易於的事件處理，Snap.svg 能夠幫助你輕鬆實現 SVG 功能。 國外Snap.svg：http://snapsvg.io/demos/
國內Snap.svg：http://www.zhangxinxu.com/wordpress/2014/02/snap-svg-fishing-css3/ 其餘http://www.jq22.com/demo/AnimatedSVGIcons-master-141127215600/ (下載http://www.jq22.com/jquery-info1085)

突襲HTML5之SVG 2D入門2 - 圖形繪製 http://www.cnblogs.com/dxy1982/archive/2012/04/06/2395729.html