blob: 2244c732975ea12d34c7a8f98cef2a8dd3b7e765 (
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
|
---
title: Esempi di tecnologie web open
slug: Web/Esempi_di_tecnologie_web_open
translation_of: Web/Demos_of_open_web_technologies
---
<p class="summary">Mozilla supporta un'ampia varietà di emozionanti tecnologie web open, e noi ne incoraggiamo l'uso. In questa pagina sono contenuti collegamenti a degli interessanti esempi di queste tecnologie.</p>
<p>Se sei al corrente di esempi ben fatti o di applicazioni che fanno uso di tecnologia web open, per favore aggiungi un link nella sezione appropriata.</p>
<h2 id="Grafica_2D">Grafica 2D</h2>
<h3 id="SVG" name="SVG">Canvas</h3>
<ul>
<li><a href="http://www.blobsallad.se/">Blob Sallad: an interactive blob using javascript and canvas</a> (<a href="http://blobsallad.se/article/" title="http://blobsallad.se/article/">code demos)</a></li>
<li><a href="http://arapehlivanian.com/wp-content/uploads/2007/02/canvas.html" title="http://arapehlivanian.com/wp-content/uploads/2007/02/canvas.html">Flying through space</a></li>
<li><a href="/samples/raycaster/RayCaster.html" title="https://developer.mozilla.org/editor/fckeditor/core/editor/samples/raycaster/RayCaster.html">3D RayCaster</a></li>
<li><a href="http://processingjs.org/exhibition/" title="http://dev.jquery.com/~john/processing.js/examples/basic/">processing.js</a></li>
<li><a href="http://gyu.que.jp/jscloth/" title="http://gyu.que.jp/jscloth/">3D on 2D Canvas</a></li>
<li><a href="http://viliusle.github.io/miniPaint/">miniPaint: Image editor</a> (<a href="https://github.com/viliusle/miniPaint">source code</a>)</li>
</ul>
<h3 id="SVG" name="SVG">SVG</h3>
<ul>
<li><a href="http://starkravingfinkle.org/projects/demo/svg-bubblemenu-in-html.xml">Bubblemenu</a> (visual effects and interaction)</li>
<li><a href="http://starkravingfinkle.org/blog/2007/07/firefox-3-svg-foreignobject/">HTML transformations</a> using <code>foreignObject</code> (visual effects and transforms)</li>
<li><a href="http://svg-whiz.com/svg/linguistics/theCreepyMouth.svg">Phonetics Guide</a> (interactive)</li>
<li><a href="http://www.lutanho.net/svgvml3d/platonic.html">3D objects demo</a> (interactive)</li>
<li><a href="http://www.themaninblue.com/experiment/Blobular/" title="http://www.themaninblue.com/experiment/Blobular/">Blobular</a> (interactive)</li>
<li><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>)</li>
<li><a href="http://summerstyle.github.io/summer/">Summer HTML image map creator</a> (<a href="https://github.com/summerstyle/summer">source code</a>)</li>
</ul>
<h3 id="Video" name="Video">Video</h3>
<ul>
<li><a href="https://vimeo.com/172328210">Video 3D Animation "mozilla constantly evolving"</a></li>
<li><a href="https://vimeo.com/173851395">Video 3D animation "Floating Dance"</a></li>
<li><a href="http://www.double.co.nz/video_test/test1.html">Streaming Anime, Movie Trailer and Interview</a></li>
<li><a href="http://www.double.co.nz/video_test/test2.html">Billy's Browser Firefox Flick</a></li>
<li><a href="http://www.double.co.nz/video_test/test3.html">Virtual Barber Shop</a></li>
<li><a href="http://www.double.co.nz/video_test/test4.html">Transformers Movie Trailer</a></li>
<li><a href="http://www.double.co.nz/video_test/test5.html">A Scanner Darkly Movie Trailer</a> (with built in controls)</li>
<li><a href="http://www.double.co.nz/video_test/events.html">Events firing and volume control</a></li>
<li><a href="http://www.double.co.nz/video_test/video.svg" title="http://www.double.co.nz/video_test/video.svg">Dragable and sizable videos</a></li>
</ul>
<h2 id="Grafica_3D">Grafica 3D</h2>
<h3 id="WebGL">WebGL</h3>
<ul>
<li><a href="http://ondras.github.io/fireworks-webgl/">Web Audio Fireworks</a></li>
<li>IoQuake3 (<a href="https://github.com/klaussilveira/ioquake3.js">source code</a>)</li>
<li>Escher puzzle (<a href="https://github.com/micahbolen/demoscene">source code</a>)</li>
<li><a href="http://collinhover.github.io/kaiopua/">Kai 'Opua</a> (<a href="https://github.com/collinhover/kaiopua">source code</a>)</li>
</ul>
<h3 id="Realtà_Virtuale">Realtà Virtuale</h3>
<ul>
<li><a href="http://mozvr.com/demos/polarsea/">The Polar Sea</a> (<a href="https://github.com/MozVR/polarsea">source code</a>)</li>
<li>Sechelt fly-through (<a href="https://github.com/mozvr/sechelt">source code</a>)</li>
</ul>
<h2 id="CSS">CSS</h2>
<ul>
<li><a href="http://www.csszengarden.com/">CSS Zen Garden</a></li>
<li><a href="http://codepen.io/SoftwareRVG/pen/OXkOWj/">CSS floating logo "mozilla"</a></li>
<li><a href="http://felixniklas.com/paperfold/">Paperfold</a></li>
<li><a href="http://ondras.github.io/blockout/">CSS Blockout</a></li>
<li><a href="http://ondras.zarovi.cz/demos/rubik/">Rubik's cube</a></li>
<li><a href="http://ondras.zarovi.cz/demos/nojs/">Pure CSS Slides</a></li>
<li>Planetarium (<a href="https://github.com/littleworkshop/planetarium">source code</a>)</li>
</ul>
<h3 id="Trasformazioni">Trasformazioni</h3>
<ul>
<li><a href="http://impress.github.io/impress.js">Impress.js</a> (<a href="https://github.com/impress/impress.js">source code</a>)</li>
</ul>
<h2 id="Giochi">Giochi</h2>
<ul>
<li>IoQuake3 (<a href="https://github.com/klaussilveira/ioquake3.js">source code</a>)</li>
<li><a href="http://collinhover.github.io/kaiopua/">Kai 'Opua</a> (<a href="https://github.com/collinhover/kaiopua">source code</a>)</li>
</ul>
<h2 id="HTML">HTML</h2>
<ul>
<li> <a href="http://zenphoton.com">Zen Photon Garden </a>(<a href="https://github.com/scanlime/zenphoton">source code</a>)</li>
</ul>
<h2 id="Web_APIs">Web APIs</h2>
<ul>
</ul>
<h3 id="Notifications_API">Notifications API</h3>
<ul>
<li><a href="http://elfoxero.github.io/html5notifications/">HTML5 Notifications</a> (<a href="https://github.com/elfoxero/html5notifications">source code</a>)</li>
</ul>
<ul>
</ul>
<h3 id="Web_Audio_API">Web Audio API</h3>
<ul>
<li><a href="http://ondras.github.io/fireworks-webgl/">Web Audio Fireworks</a></li>
<li><a href="http://ondras.github.io/oscope/">oscope.js - JavaScript oscilloscope</a></li>
<li><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>)</li>
<li><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>)</li>
<li><a href="http://carlosrafaelgn.com.br/GraphicalFilterEditor/">Graphical Filter Editor and Visualizer</a> (<a href="https://github.com/carlosrafaelgn/GraphicalFilterEditor">source code</a>)</li>
</ul>
<h3 id="File_API">File API</h3>
<ul>
<li><a href="http://palerdot.github.io/slide-my-text/">Slide My Text - presentation from plain text files</a></li>
</ul>
<h3 id="Unclassified" name="Unclassified">Web Workers</h3>
<ul>
<li><a href="http://ondras.github.io/fractal/">Web Worker Fractals</a></li>
<li><a href="http://ondras.github.io/photo/">Photo editor</a></li>
<li><a href="http://ondras.github.io/coral/">Coral generator</a></li>
<li><a href="http://nerget.com/rayjs-mt/rayjs.html" title="http://nerget.com/rayjs-mt/rayjs.html">Raytracer</a></li>
<li><a href="http://palerdot.github.io/hotcold/">HotCold Touch Typing</a></li>
</ul>
|
