blob: 509f06fd23ae0023701889222b015c4d3439cb43 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
|
---
title: Demonstrações de tecnologia web aberta
slug: Web/Demos
translation_of: Web/Demos_of_open_web_technologies
original_slug: Web/Demos_of_open_web_technologies
---
<p class="summary">A mozilla suporta uma grande variedade de tecnologias abertas da web aberta e nós encorajamos seu uso.Esta página oferece links para demonstrações interessantes dessas tecnologia.</p>
<p>Se você conhece uma boa demonstração ou aplicação da tecnologia web aberta, adicione um link para a seção apropriada aqui.</p>
<h2 id="Gráficos_2D">Gráficos 2D</h2>
<h3 dir="ltr" id="Tela_de_pintura">Tela de pintura</h3>
<ul>
<li>
<p><a href="http://www.blobsallad.se/">Blob Sallad: an interactive blob using javascript and canvas</a> (<a href="http://blobsallad.se/article/">code demos)</a></p>
</li>
<li>
<p><a href="http://arapehlivanian.com/wp-content/uploads/2007/02/canvas.html">Flying through space</a></p>
</li>
<li>
<p><a href="/samples/raycaster/RayCaster.html" title="https://developer.mozilla.org/editor/fckeditor/core/editor/samples/raycaster/RayCaster.html">3D RayCaster</a></p>
</li>
<li>
<p><a href="http://processingjs.org/exhibition/">processing.js</a></p>
</li>
<li>
<p><a href="http://gyu.que.jp/jscloth/">3D on 2D Canvas</a></p>
</li>
<li>
<p><a href="http://viliusle.github.io/miniPaint/">miniPaint: Image editor</a> (<a href="https://github.com/viliusle/miniPaint">source code</a>)</p>
</li>
</ul>
<h3 id="SVG" name="SVG">SVG</h3>
<ul>
<li>
<p><a href="http://starkravingfinkle.org/projects/demo/svg-bubblemenu-in-html.xml">Bubblemenu</a> (visual effects and interaction)</p>
</li>
<li>
<p><a href="http://starkravingfinkle.org/blog/2007/07/firefox-3-svg-foreignobject/">HTML transformations</a> using <code>foreignObject</code> (visual effects and transforms)</p>
</li>
<li>
<p><a href="http://svg-whiz.com/svg/linguistics/theCreepyMouth.svg">Phonetics Guide</a> (interactive)</p>
</li>
<li>
<p><a href="http://www.lutanho.net/svgvml3d/platonic.html">3D objects demo</a> (interactive)</p>
</li>
<li>
<p><a href="http://www.themaninblue.com/experiment/Blobular/">Blobular</a> (interactive)</p>
</li>
<li>
<p><a href="http://www.double.co.nz/video_test/video.svg">Video embedded in SVG</a> (or use the <a href="http://www.double.co.nz/video_test/video_svg.tar.bz2">local download</a>)</p>
</li>
<li>
<p><a href="http://summerstyle.github.io/summer/">Summer HTML image map creator</a> (<a href="https://github.com/summerstyle/summer">source code</a>)</p>
</li>
</ul>
<h3 dir="ltr" id="Vídeo">Vídeo</h3>
<ul>
<li>
<p><a href="https://vimeo.com/172328210">Video 3D Animation "mozilla constantly evolving"</a></p>
</li>
<li>
<p><a href="https://vimeo.com/173851395">Video 3D animation "Floating Dance"</a></p>
</li>
<li>
<p><a href="http://www.double.co.nz/video_test/test1.html">Streaming Anime, Movie Trailer and Interview</a></p>
</li>
<li>
<p><a href="http://www.double.co.nz/video_test/test2.html">Billy's Browser Firefox Flick</a></p>
</li>
<li>
<p><a href="http://www.double.co.nz/video_test/test3.html">Virtual Barber Shop</a></p>
</li>
<li>
<p><a href="http://www.double.co.nz/video_test/test4.html">Transformers Movie Trailer</a></p>
</li>
<li>
<p><a href="http://www.double.co.nz/video_test/test5.html">A Scanner Darkly Movie Trailer</a> (with built in controls)</p>
</li>
<li>
<p><a href="http://www.double.co.nz/video_test/events.html">Events firing and volume control</a></p>
</li>
<li>
<p><a href="http://www.double.co.nz/video_test/video.svg">Dragable and sizable videos</a></p>
</li>
</ul>
<h2 id="Gráficos_3D">Gráficos 3D</h2>
<h3 id="WebGL">WebGL</h3>
<ul>
<li>
<p><a href="http://ondras.github.io/fireworks-webgl/">Web Audio Fireworks</a></p>
</li>
<li>
<p>IoQuake3 (<a href="https://github.com/klaussilveira/ioquake3.js">source code</a>)</p>
</li>
<li>
<p>Escher puzzle (<a href="https://github.com/micahbolen/demoscene">source code</a>)</p>
</li>
<li>
<p><a href="http://collinhover.github.io/kaiopua/">Kai 'Opua</a> (<a href="https://github.com/collinhover/kaiopua">source code</a>)</p>
</li>
</ul>
<h3 id="Realidade_virtual">Realidade virtual</h3>
<ul>
<li>
<p><a href="http://mozvr.com/demos/polarsea/">The Polar Sea</a> (<a href="https://github.com/MozVR/polarsea">source code</a>)</p>
</li>
<li>
<p>Sechelt fly-through (<a href="https://github.com/mozvr/sechelt">source code</a>)</p>
</li>
</ul>
<h2 id="CSS">CSS</h2>
<ul>
<li>
<p><a href="http://www.csszengarden.com/">CSS Zen Garden</a></p>
</li>
<li>
<p><a href="http://codepen.io/SoftwareRVG/pen/OXkOWj/">CSS floating logo "mozilla"</a></p>
</li>
<li>
<p><a href="http://felixniklas.com/paperfold/">Paperfold</a></p>
</li>
<li>
<p><a href="http://ondras.github.io/blockout/">CSS Blockout</a></p>
</li>
<li>
<p><a href="http://ondras.zarovi.cz/demos/rubik/">Rubik's cube</a></p>
</li>
<li>
<p><a href="http://ondras.zarovi.cz/demos/nojs/">Pure CSS Slides</a></p>
</li>
<li>
<p>Planetarium (<a href="https://github.com/littleworkshop/planetarium">source code</a>)</p>
</li>
</ul>
<h3 id="Transformações">Transformações</h3>
<ul>
<li>
<p><a href="http://impress.github.io/impress.js">Impress.js</a> (<a href="https://github.com/impress/impress.js">source code</a>)</p>
</li>
</ul>
<h2 id="jogos">jogos</h2>
<ul>
<li>
<p>IoQuake3 (<a href="https://github.com/klaussilveira/ioquake3.js">source code</a>)</p>
</li>
<li>
<p><a href="http://collinhover.github.io/kaiopua/">Kai 'Opua</a> (<a href="https://github.com/collinhover/kaiopua">source code</a>)</p>
</li>
<li>
<p><a href="https://github.com/gustavoSoriano/game-canvas">Game canvas (source code)</a></p>
</li>
</ul>
<h2 id="HTML">HTML</h2>
<ul>
<li>
<p> <a href="http://zenphoton.com">Zen Photon Garden </a>(<a href="https://github.com/scanlime/zenphoton">source code</a>)</p>
</li>
</ul>
<h2 id="API_da_Web">API da Web</h2>
<ul>
</ul>
<h3 id="API_de_notificações">API de notificações</h3>
<ul>
<li>
<p><a href="http://elfoxero.github.io/html5notifications/">HTML5 Notifications</a> (<a href="https://github.com/elfoxero/html5notifications">source code</a>)</p>
</li>
</ul>
<ul>
</ul>
<h3 dir="ltr" id="API_de_áudio_da_Web">API de áudio da Web</h3>
<ul>
<li>
<p><a href="http://ondras.github.io/fireworks-webgl/">Web Audio Fireworks</a></p>
</li>
<li>
<p><a href="http://ondras.github.io/oscope/">oscope.js - JavaScript oscilloscope</a></p>
</li>
<li>
<p><a href="http://nipe-systems.de/webapps/html5-web-audio/">HTML5 Web Audio Showcase</a> (<a href="https://github.com/NIPE-SYSTEMS/html5-web-audio-showcase">source code</a>)</p>
</li>
<li>
<p><a href="http://wayou.github.io/HTML5_Audio_Visualizer/">HTML5 Audio Visualizer</a> (<a href="https://github.com/Wayou/HTML5_Audio_Visualizer">source code</a>)</p>
</li>
<li>
<p><a href="http://carlosrafaelgn.com.br/GraphicalFilterEditor/">Graphical Filter Editor and Visualizer</a> (<a href="https://github.com/carlosrafaelgn/GraphicalFilterEditor">source code</a>)</p>
</li>
</ul>
<h3 id="API_de_arquivos">API de arquivos</h3>
<ul>
<li>
<p><a href="http://palerdot.github.io/slide-my-text/">Slide My Text - presentation from plain text files</a></p>
</li>
</ul>
<h3 id="Unclassified" name="Unclassified">Trabalhadores da Web</h3>
<ul>
<li>
<p><a href="http://ondras.github.io/fractal/">Web Worker Fractals</a></p>
</li>
<li>
<p><a href="http://ondras.github.io/photo/">Photo editor</a></p>
</li>
<li>
<p><a href="http://ondras.github.io/coral/">Coral generator</a></p>
</li>
<li>
<p><a href="http://nerget.com/rayjs-mt/rayjs.html">Raytracer</a></p>
</li>
<li>
<p><a href="http://palerdot.github.io/hotcold/">HotCold Touch Typing</a></p>
</li>
</ul>
|
