User:Stonestone/RandomNotes: Difference between revisions

Latest revision as of 10:20, 9 May 2016

Recommendations of tools from Sébastien（全名：赵心悦心中的屌丝）:
https://www.youtube.com/watch?v=uXwSFSoFo9Q Works of him:1)https://www.youtube.com/watch?v=KoF7NIlUy9g 2)https://www.youtube.com/watch?v=v5h1JvlYrow 3)https://vimeo.com/151893504

openFrameworks http://openframeworks.cc/
TouchDesigner (Windows only) https://www.derivative.ca/088/Downloads/
Audio-reaction on Unity https://github.com/keijiro?tab=repositories
Addons http://www.ofxaddons.com/categories
Realtime Sound analysis https://github.com/kylemcdonald/ofxFft
Realtime Sound analysis https://github.com/micknoise/Maximilian
Communities & Samples https://www.shadertoy.com/ https://www.shadertoy.com/view/Ms2SD1
Book http://www.scribd.com/doc/74093210/Generative-Art-Matt-Pearson#scribd https://www.manning.com/books/generative-art http://rutracker.org/forum/viewtopic.php?t=3829690

Test https://iffr.com/en/2016/films/establishing-eden http://exhibitionist.nl/tentoonstelling/establishing-eden/ https://www.youtube.com/watch?v=xXHJ41_1BZ0 https://www.youtube.com/watch?v=mtoerB1I1eQ https://www.youtube.com/watch?v=ed9sf0kdZn4 https://www.youtube.com/watch?v=NOvKpX8xbcI

http://1646.nl/projects/mindplace-thoughtstream https://vimeo.com/126439388

References From David for Nosebleed
ED OP DE BEEK (STAGING SILENCE)
GUIDO
JACCO CLAERBOUT
ISSAC JULIEN
CEAL FLOYER

Done Birthing Stopped Dead

Sometimes I sleep...

~ -- tilde 波浪线 
! -- bang [或 Exclamation mark] 叹号 
@ -- at 
# -- number sign [或 pound sign] 井号 hashtag
$ -- dollar 美元符 
%-- percent 百分号 
^ -- accent 幂 
& -- and 和 
* -- star [或 asterisk] 星号 
( -- open round 左括号
）-- close round 右括号 
+ -- plus 加 
- -- sub [或 midline 或 dash] 减 
= -- equal 等于 
_ -- underline 下划线 
\ -- backslash 反斜线 
| -- vertical [或 bar] 竖线 
{ -- open brace 左花括号 
} -- close brace 右花括号 
[ -- open quad 左方括号 
] -- close quad 左方括号 
: -- colon 冒号 
; -- semicolon 分号 
" -- quote 引号 
' -- single quote 单引号 
? -- question 问号 
/ -- slash 斜线 
< -- open angle (less-than sign) 左尖括号（小于号） 
> -- close angle (greater-than sign)右尖括号（大于号） 
, -- comma 逗号 
. -- dot 点号
还有空白符: 
' ' -- space 空格
'\n' -- newline 换行
'\t' -- table 制表符
\r' -- return ？？？
至于 "..." 不是单个字符，就不列在上面了，英文名为ellipsis （省略符）

德行第一
，

言语第二
，

政事第三
，

文学第四
，

方正第五
，

雅量第六
，

识鉴第七
，

赏誉第八
，

品藻第九
，

规箴第十
，

捷悟第十一
，

夙慧第十二
，

豪爽第十三
，

容止第十四
，

自新第十五
，

企羡第十六
，

伤逝第十七
，

栖逸第十八
，

贤媛第十九
，

术解第二十
，

巧艺第二十一
，

宠礼第二十二
，

任诞第二十三
，

简傲第二十四
，

排调第二十五
，

轻诋第二十六
，

假谲第二十七
，

黜免第二十八
，

俭啬第二十九
，

汰侈第三十
，

忿狷第三十一
，

谗险第三十二
，

尤悔第三十三
，

纰漏第三十四
，

惑溺第三十五
，

仇隙第三十六
。

stickers of I love my home

===============================CSS 居中专区===============================

A.不定宽度的块状元素有三种方法居中（这三种方法目前使用的都比多）：
1)加入 table 标签
第一步：为需要设置的居中的元素外面加入一个 table 标签 ( 包括 <tbody>、<tr>、<td> )。
<div>
<table>
  <tbody>
    <tr><td>
    <ul>
        <li><a href="#">1</a></li>
        <li><a href="#">2</a></li>
        <li><a href="#">3</a></li>
    </ul>
    </td></tr>
  </tbody>
</table>
</div>
第二步：为这个 table 设置“左右 margin 居中”（这个和定宽块状元素的方法一样）。
<style>
table{
    margin:0 auto;
}
ul{list-style:none;margin:0;padding:0;}
li{float:left;display:inline;margin-right:8px;}
</style>

2)设置 display;inline 方法
改变块级元素的 display 为 inline 类型，然后使用 text-align:center 来实现居中效果。如下例子
<body>
<div class="container">
    <ul>
        <li><a href="#">1</a></li>
        <li><a href="#">2</a></li>
        <li><a href="#">3</a></li>
    </ul>
</div>
</body>
<style>
.container{
    text-align:center;
}
.container ul{
    list-style:none;
    margin:0;
    padding:0;
    display:inline;
}
.container li{
    margin-right:8px;
    display:inline;
}
</style>

3) 设置 position:relative 和 left:50%;
父元素设置 float，然后给父元素设置 position:relative 和 left:50%
子元素设置 position:relative 和 left:-50% 来实现水平居中
<body>
<div class="container">
    <ul>
        <li><a href="#">1</a></li>
        <li><a href="#">2</a></li>
        <li><a href="#">3</a></li>
    </ul>
</div>
</body>
<style>
.container{
    float:left;
    position:relative;
    left:50%
}
.container ul{
    list-style:none;
    margin:0;
    padding:0;  
    position:relative;
    left:-50%;
}
.container li{float:left;display:inline;margin-right:8px;}
</style>


 

B.父元素高度确定的单行文本的竖直居中的方法是通过设置父元素的 height 和 line-height 高度一致来实现的。如下代码：
<div class="container">
    hi,imooc!
</div>
<style>
.container{
    height:100px;
    line-height:100px;
    background:#999;
}
</style>

垂直居中-父元素高度确定的多行文本:
方法一：使用插入 table (包括tbody、tr、td)标签，同时设置 vertical-align：middle。
说到竖直居中，css 中有一个用于竖直居中的属性 vertical-align，但这个样式只有在父元素为 td 或 th 时，才会生效。所以又要插入 table 标签了。下面看一下例子：
html代码：
<body>
<table><tbody><tr><td class="wrap">
<div>
    <p>看我是否可以居中。</p>
    <p>看我是否可以居中。</p>
    <p>看我是否可以居中。</p>
    <p>看我是否可以居中。</p>
    <p>看我是否可以居中。</p>
</div>
</td></tr></tbody></table>
</body>
css代码：
table td{height:500px;background:#ccc}
因为 td 标签默认情况下就默认设置了 vertical-align 为 middle，所以我们不需要显式地设置了。

方法二:在 chrome、firefox 及 IE8 以上的浏览器下可以设置块级元素的 display 为 table-cell，激活 vertical-align 属性，但注意 IE6、7 并不支持这个样式。
html代码：
<div class="container">
    <div>
        <p>看我是否可以居中。</p>
        <p>看我是否可以居中。</p>
        <p>看我是否可以居中。</p>
        <p>看我是否可以居中。</p>
        <p>看我是否可以居中。</p>
    </div>
</div>
css代码：
<style>
.container{
    height:300px;
    background:#ccc;
    display:table-cell;/*IE8以上及Chrome、Firefox*/
    vertical-align:middle;/*IE8以上及Chrome、Firefox*/
}
</style>
这种方法的好处是不用添加多余的无意义的标签，但缺点也很明显，它的兼容性不是很好，不兼容 IE6、7。

http://www.imooc.com/code/407

http://www.gfxcamp.com/premiere-2015/


------->Basic DOM<-------

HTML文档可以说由节点构成的集合，三种常见的DOM节点:
1. 元素节点：上图中<html>、<body>、<p>等都是元素节点，即标签。
2. 文本节点:向用户展示的内容，如<li>...</li>中的JavaScript、DOM、CSS等文本。
3. 属性节点:元素属性，如<a>标签的链接属性href="http://www.imooc.com"。
看下面代码:
<a href="http://www.imooc.com">JavaScript DOM</a>

通过ID获取元素
学过HTML/CSS样式，都知道，网页由标签将信息组织起来，而标签的id属性值是唯一的，就像是每人有一个身份证号一样，只要通过身份证号就可以找到相对应的人。那么在网页中，我们通过id先找到标签，然后进行操作。
语法:
 document.getElementById(“id”)

Presentation of T & C :https://pad.pzimediadesign.nl/p/stonenotesontc

@@ Line 1: / Line 1: @@
+<span style="font-weight: bold;border-style: solid;border-width: 2px 5px 7px;background-color:#ffc299">[[User:Stonestone/vaporwavefffff| A Guide Book of Vaporwave]]</span>
+<hr />[http://pzwart1.wdka.hro.nl/pad/p/stone-unity5 IN A HURRY UNITY 5]<hr />
+<big>'''Recommendations of tools from Sébastien（全名：赵心悦心中的屌丝）:'''</big><br />
+https://www.youtube.com/watch?v=uXwSFSoFo9Q
+Works of him:1)https://www.youtube.com/watch?v=KoF7NIlUy9g 2)https://www.youtube.com/watch?v=v5h1JvlYrow 3)https://vimeo.com/151893504
+* openFrameworks http://openframeworks.cc/
+*  TouchDesigner (Windows only) https://www.derivative.ca/088/Downloads/
+* Audio-reaction on Unity  https://github.com/keijiro?tab=repositories
+* Addons http://www.ofxaddons.com/categories
+* Realtime Sound analysis https://github.com/kylemcdonald/ofxFft
+* Realtime Sound analysis  https://github.com/micknoise/Maximilian
+* Communities & Samples https://www.shadertoy.com/ https://www.shadertoy.com/view/Ms2SD1
+* Book http://www.scribd.com/doc/74093210/Generative-Art-Matt-Pearson#scribd   https://www.manning.com/books/generative-art http://rutracker.org/forum/viewtopic.php?t=3829690
+<hr />
 <span style="font-weight: bold;border-style: solid;border-width: 2px 5px 7px;">[[User:Stonestone/stonemustknowthem|Test]]</span>
 https://iffr.com/en/2016/films/establishing-eden
 http://exhibitionist.nl/tentoonstelling/establishing-eden/
@@ Line 248: / Line 262: @@
 </pre>
 http://www.gfxcamp.com/premiere-2015/
+<pre>
+------->Basic DOM<-------
+HTML文档可以说由节点构成的集合，三种常见的DOM节点:
+. 元素节点：上图中<html>、<body>、<p>等都是元素节点，即标签。
+. 文本节点:向用户展示的内容，如<li>...</li>中的JavaScript、DOM、CSS等文本。
+. 属性节点:元素属性，如<a>标签的链接属性href="http://www.imooc.com"。
+看下面代码:
+<a href="http://www.imooc.com">JavaScript DOM</a>
+通过ID获取元素
+学过HTML/CSS样式，都知道，网页由标签将信息组织起来，而标签的id属性值是唯一的，就像是每人有一个身份证号一样，只要通过身份证号就可以找到相对应的人。那么在网页中，我们通过id先找到标签，然后进行操作。
+语法:
+ document.getElementById(“id”)
+</pre>
+<hr /><hr />
+Presentation of T & C :https://pad.pzimediadesign.nl/p/stonenotesontc