和城乡建设厅官方网站/青岛百度推广seo价格
首先来了解下游戏在各个平台中的最终表现形式
H5：canvas
Android：SurfaceView
IOS：UIView
在浏览器中，打开开发者工具，可以清楚地看到游戏所在的div
在调试模式下可以看到，canvas所在的div中id为Cocos2dGameContainer，所以首先要获取该div：
let divGame = document.getElementById("Cocos2dGameContainer");然后根据需要，创建H5的element，添加到该div中：
divGame.appendChild(element);如添加img后：
1图片(长按保存)
在gif中可以看到游戏的canvas中鼠标右键是无法弹出菜单的，但是添加的H5元素的img右键会弹出相应菜单，在手机上的表现就是长按出现保存图片等操作
代码：
@property({ type: cc.Texture2D })
asset: cc.Texture2D = null;let img = document.createElement("img");
img.src = this.asset.nativeUrl; //图片路径
// img.src = dataURL; //截图数据
img.id = "capture";
img.alt = "capture";
// img.width = cc.winSize.width;
// img.height = cc.winSize.height;
img.width = 195;
img.height = 270;
img.style.position = "absolute";
img.style.top = 0;
img.style.left = 0;
let divGame = document.getElementById("Cocos2dGameContainer");
divGame.appendChild(img);
//删除
//divGame.removeChild(img);2按钮(videoplayer/webbiew上层)
代码：
@property({ type: cc.Texture2D })
assetNormal: cc.Texture2D = null;
@property({ type: cc.Texture2D })
assetPress: cc.Texture2D = null;let button = document.createElement("img");
button.src = this.assetNormal.nativeUrl;
button.id = "button";
//button的锚点为左上角
button.width = 88;
button.height = 135;
button.style.position = "absolute";
button.style.top = "30%";
button.style.left = "30%";
button.onclick = function () {
button.src = this.assetNormal.nativeUrl;
alert("onclick");
}.bind(this);
button.onmousedown = function () {
button.src = this.assetPress.nativeUrl;
}.bind(this);
let divGame = document.getElementById("Cocos2dGameContainer");
divGame.appendChild(button);
笔记
扫码关注