本文爲 H5EDU 機構官方 HTML5培訓 教程，主要介紹：JavaScript強化教程 —— Cocos2d-JS的屏幕適配方案
1. 設置屏幕適配策略（Resolution Policy）
如果你還沒有用過Resolution Policy，只需要在遊戲載入過程完成之後（cc.game.onStart函數回調中），調用下面的代碼：
cc.view.setDesignResolutionSize(320, 480, cc.ResolutionPolicy.SHOW_ALL);
setDesignResolutionSize函數的前兩個參數是你想要在你的代碼中使用的遊戲分辨率，第三個參數就是你選擇的適配方案。引擎中內置了5種適配方案，每種都有自己獨特的行爲，詳見下文。
如果你已經設置了設計分辨率，那麼你可以直接設置你的Resolution Policy：
cc.view.setResolutionPolicy(cc.ResolutionPolicy.NO_BORDER);
原生遊戲中游戲總是使用全部屏幕空間，但是在WEB端你的網頁中也許除了遊戲還有別的視覺或文字元素，或者也許你需要給你的遊戲設計一個漂亮的邊框。所以Cocos2d-JS中Web引擎的適配方案會默認適配遊戲Canvas元素的父節點，如果你希望遊戲場景適配瀏覽器屏幕，那麼只需要將Canvas直接放置到body下就可以了：
<body>
<canvas id="gameCanvas"></canvas>
</body>
2. Resolution Policy的意義
使用Resolution Policy的好處很明顯，不論設備屏幕大小如何，也不論瀏覽器窗口的寬高比，你的遊戲場景都會被自動放縮到屏幕大小。更重要的是，在遊戲代碼中，你將永遠使用你所設計的遊戲分辨率來佈置遊戲場景。比如說，如果你將設計分辨率設置爲320 * 480，那麼在遊戲代碼中你的遊戲窗口右上角座標將永遠是(320, 480)(在FIXED_WIDTH模式高度可能會被縮放，同樣在FIXED_HEIGHT模式下寬度可能存在縮放的情況，具體看下文說明)。
3. 監聽瀏覽器窗口大小變化事件
新的適配方案允許在瀏覽器大小變化的時候自動重新嘗試適配。比如說，當用戶拖拽來改變瀏覽器大小，或者更有用的情況，當他們轉動自己手機方向的時候。遊戲中任意時刻都可以開啓這種行爲，只需要調用cc.view的resizeWithBrowserSize函數：
cc.view.resizeWithBrowserSize(true);
爲了更靈活得應對變化，我們爲cc.view提供了一個新的函數，你可以通過setResizeCallback函數註冊一個回調函數來監聽瀏覽器窗口大小變化事件：
cc.view.setResizeCallback(function() {
// 做任何你所需要的遊戲內容層面的適配操作
// 比如說，你可以針對用戶的移動設備方向來決定所要應用的適配模式
});
4. Fullscreen API
Fullscreen API是瀏覽器允許Web頁面在獲得用戶全屏幕的一個新的制定中的API。
Cocos2d-JS在移動端瀏覽器中會嘗試自動進入全屏幕來給用戶更好的遊戲體驗（需要指出並不是所有瀏覽器都支持這個API）。
另一方面，桌面端幾乎所有現代瀏覽器都支持Fullscreen API，如果你希望使用這個API，Cocos2d-JS也簡化了它的使用方式：
嘗試進入全屏模式（需要用戶交互）: cc.screen.requestFullScreen(targetElement, onFullScreenCallback);
檢測是否處於全屏模式: cc.screen.fullScreen();
退出全屏模式: cc.screen.exitFullScreen();
4.4.3 重要概念
1. 遊戲外框 Frame
遊戲外框是你的遊戲Canvas元素的初始父節點，一般情況下，它是html文檔的body元素。但是如果你願意，它可以是DOM結構中的任意容器節點。Canvas元素的初始大小並不重要，屏幕適配過程中它會被自動放縮來適應你設置的外框大小。 再次提醒，如果你希望遊戲窗口適應整個瀏覽器窗口，那麼只需要將Canvas元素直接放在body下。
2. 遊戲容器 Container
在Cocos2d-JS的初始化進程中，引擎會自動將你的Canvas元素放置到一個DIV容器中，而這個容器會被加入到Canvas的原始父節點（遊戲外框）中。這個遊戲容器是實現屏幕適配方案的重要輔助元素，你可以通過cc.container來訪問它。
3. 遊戲世界 Content
遊戲世界代表遊戲內使用的世界座標系。
4. 視窗 Viewport
視窗是遊戲世界相對於遊戲Canvas元素座標系中的座標及大小.
5. 容器適配策略 Container Strategy
容器適配策略負責對遊戲容器和遊戲Canvas元素進行放縮以適應遊戲外框。
6. 內容適配策略 Content Strategy
內容適配策略負責將遊戲世界放縮以適應遊戲容器，同時也會計算並設置視窗。