-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
78 lines (70 loc) · 2.82 KB
/
index.html
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
---
layout: default
title: Three.js World
description: Three.js World is a site for web developers who want to learn how to use three.js, a JavaScript library that brings 3D animation to the web with HTML5 and WebGL technology. Covers advanced topics too like character rigging, UV maps, webgl demos, physics engines and video player. Create an incredible media experience or a full 3D game.
example: index
amp: true
redirect_from:
- /m
- /mobile
- /m/
- /mobile/
---
<div class="home" id="content-wrapper">
<section class="s1">
<div class="padding flex-business"></div>
<!--<div class="padding flex-business">
<div id="canvases"></div>
{% for file in site.static_files %}
{% if
file.path == '/js/examples/ex6.js' or
file.path == '/js/examples/ex2.js' or
file.path == '/js/examples/ex3.js' or
file.path == '/js/examples/ex4.js' or
file.path == '/js/examples/ex5.js' %}
<script src="{{file.path}}"></script>
{% endif %}
{% endfor %}
</div>-->
</section>
<p class="flex-container bold-links m-top-40">Welcome to Three.js World - a site for web developers who want to learn how to use three.js, a JavaScript library that brings 3D animation to the web with HTML5 and WebGL technology.
<amp-img class="hero" src="images/hero.jpg" width="1367" height="578" alt="{{site.title}}" layout="responsive"></amp-img>
3D graphics can be obtained easily now that browsers and devices are so powerful, and with the growing popularity of virtual reality and VR headsets like Google Cardboard and the Oculus Rift, there are more opportunities to utilize 3D design. Learn how to integrate the web with 3d modeling software assets from Blender, 3D Studio Max or Maya.
<br><br>Try an <a href="{{site.url}}/tutorials/getting-started-with-three-js">easy example</a> if you're just getting started, or see how a <a href="{{site.url}}/threejs-game-tutorial-climber">complete project</a> comes together.</p>
<section class="s2 padding">
<h2>Featured</h2>
<div class="boxes">
{% for post in site.tags.featured limit: 5 %}
{% include box.html %}
{% endfor %}
</div>
</section>
<section class="s3 padding">
<h2>#advanced</h2>
<div class="boxes">
{% for post in site.tags.advanced limit: 5 %}
{% include box.html %}
{% endfor %}
</div>
</section>
<section class="s4 padding">
<h2>Tutorials</h2>
<div class="boxes">
{% for post in site.categories.Tutorials limit: 5 %}
{% include box.html %}
{% endfor %}
</div>
</section>
<section class="s5 padding">
<h2>More three.js Tutorials</h2>
<div class="links">
{% for post in site.posts %}
{% include structured-data-loop.html %}
<article class="link">
<a href="{{ post.url }}">{{ post.title }}</a>
<p>{{ post.category }} <a href="{{site.url}}{{post.url}}"></a></p>
</article>
{% endfor %}
</div>
</section>
</div>