JavaScript入门笔记

　　不需要刻意记忆函数或者命令，要学会查用技术文档，而且用多了自然就记住了。　　

　　noStroke(); 去除外形轮廓 //驼峰命名法

　　stroke(255, 0, 0); 线条颜色默认红色。RGB取色器。三个参数分别代表R,G,B所占比例。　　

　　background(r, g, b)Set the background color，背景色设置

　　fill(r, g, b)Set the fill color for shapes，（图形）形状填充色

　　mouseX, mouseY,可直接调用，但必须在函数内。

　　mouseX指鼠标X轴坐标，可替换函数内的X值也可替代Y值，会出现不同的效果。图形类函数及颜色类函数均可使用mouseX & mouseY.

　　如以下代码，跟随鼠标移动的小圆圈。

 1 // mouseX and mouseY
 2 
 3 strokeWeight(3);
 4 stroke(57, 0, 214);
 5 fill(0, 210, 247);
 6 
 7 
 8 draw = function() {
 9     
10     background(255, 255, 255);
11     
12     ellipse(mouseX, mouseY, 30, 30);
13     
14 };

　　若不使用background，则移动鼠标后，小圆圈会留下残影。效果操作　　ps. 博客园不能直接上传图片，有点小遗憾。10月开始可以上传图片了。

　　使用background则不会留下残影。

　　对代码进行试验性测试时，可直接在函数前加上“//”，将之变为注释。这样，便于将代码恢复原状。

　　textFont();中自带textSize参数并有默认值,，故textSize();会与之冲突。因为代码按顺序执行，若以textSize()控制字体大小，需放在textFont();语句之后。

　　淡入淡出效果,代码如下：

 1 var fade = 400;
 2 var fade_size = 40;
 3 
 4 draw = function() {
 5     background(242, 242, 242);
 6     fill(0, 26, 255);
 7     textSize(30);
 8     text("infocodez", 80+fade, 100);
 9     
10     fill(0, 26, 255);
11     textSize(30);
12     text("infocodez", 80-fade, 150);
13     
14     fill(0, 26, 255);
15     textSize(30+fade_size);
16     text("infocodez", 80, 200);//出现两个字符是因为视觉残留
17     
18     fill(0, 26, 255);
19     textSize(30-fade_size);
20     text("infocodez", 80, 250);  
21     
22     fade *= 0.97;
23     fade_size *= 0.96;
24     };