当前位置: 首页 > 工具软件 > CreateJS > 使用案例 >

Createjs 学习笔记

颛孙嘉玉
2023-12-01

记录在使用Createjs工作时遇到的问题和学到的知识点

Createjs官方文档链接

  • 让显示对象在当鼠标滑过时变小手:displayObject.cursor = “pointer”;

  • 关于图片跨域的解决办法

    图片跨越问题解决办法原文链接

     很多人用createjs都会出现跨域问题,
     
     Uncaught An error has occurred. This is most likely due to security restrictions on reading canvas pixel data with local or cross-domain images.
     上面这个问题,如果你是双击文件运行报出的(只要地址前缀file:开头的都算),你只需要在环境中打开就可以,比如animateCC你可以选择用ctrl+enter打开,一些前端IDE自带环境的可以直接在IDE里用浏览器打开,什么都没有,你可以选择放到服务器上看。如果在服务器环境上也报这个问题,特别是点击的时候报的问题,你可以这么设置图片:
     
     var hitArea = new createjs.Shape();
     hitArea.graphics.beginFill("#000").drawRect(0,0,92,92);//这里是图片大小
     
     bitmap.hitArea = hitArea;
     
     凡是点击出的跨域问题上面的方法都能解决。
     
     Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
     
     这个问题也是同样的,如果你是双击文件直接打开的(只要地址前缀file:开头的都算),放到环境中就好了,如果还没好,让后台设置一下跨域,后台怎么设置跨域?这个你得问你们公司的后端程序员。
     
     No 'Access-Control-Allow-Origin' header is present on the requested resource. Originis therefore not allowed access
     
     这个错误只要你放弃使用xhr模式加载,也就是new createjs.LoadQueue(false);括号里面的参数传false就行了,如果一定要用xhr模式加载,那就只能需要服务器允许才可以跨域的,也就是需要你们后端设置。
     
     An error has occurred. This is most likely due to security restrictions on WebGL images with local or cross-domain origins
     
     这个跨域很明显就是使用了stagegl跨的域,使用stagegl渲染非本地图片必须得到跨域允许,也就是还是需要后端设置。
     
     其他的跨域
     
     其他的跨域只要不是https跨域,和点击图片跨域,都可以让后台设置解决,后台解决不了就是你们公司后端的问题。
    
  • createjs 斜体字

     let text2 = new createjs.Text("方正黑体简体+XY字母倾斜+shadow!", "italic  35px Times New Roman,方正黑体简体,Serif", "#ff7700");
    	 text2.shadow = new createjs.Shadow("#000000", 5, 5, 10);      // 创建一个shadow实例Object
    	 this.addChild(text2);
    
  • zimjs TextArea 文本输入框水平垂直居中:

    //通过设置textArea.tag.style来设置TextArea的css 样式。
    textArea1  = new TextArea({width:100, height:60,size:30,padding:0,color:'#000000',backgroundColor:'#DAEAF7',
    	wrap:false,maxLength:4}).pos(x-120,y);
    	textArea1.tag.style.textAlign = 'center';
    	textArea1.tag.style.lineHeight = '60px'; //设置lineHeight与height一样大,就垂直居中了 
    textArea.tag.style.textAlign = 'center'; //水平居中,
    
 类似资料: