You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
53 lines
1.4 KiB
53 lines
1.4 KiB
<html>
|
|
<head>
|
|
<title>First very simple WebGL example...</title>
|
|
<link rel="stylesheet" href="css/main.css">
|
|
<script type="text/javascript" src="js/parallax.js"></script>
|
|
<script type="text/javascript" src="js/gl-matrix-min.js"></script>
|
|
<script type="text/javascript" src="js/square.js"></script>
|
|
|
|
<script id="square-vertex-shader" type="x-shader/x-vertex">
|
|
attribute vec3 vertexPos;
|
|
uniform mat4 modelViewMatrix;
|
|
uniform mat4 projectionMatrix;
|
|
void main(void) {
|
|
// Return the transformed and projected vertex value
|
|
gl_Position =
|
|
projectionMatrix * modelViewMatrix * vec4(vertexPos, 1.0);
|
|
}
|
|
</script>
|
|
|
|
<script id="square-fragment-shader" type="x-shader/x-fragment">
|
|
void main(void) {
|
|
// Return the pixel color: always output white
|
|
gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0);
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.result_container {
|
|
height: 200px;
|
|
}
|
|
</style>
|
|
</head>
|
|
|
|
<body onLoad="startGl();init()" onScroll="parallax()">
|
|
<div id="background"></div>
|
|
<div id="back" class="text">
|
|
<a href="index.html">back</a>
|
|
</div>
|
|
<div id="content" class="text">
|
|
<h1>First very simple WebGL example...</h1>
|
|
<p>
|
|
This is the beginning, not even 3D. Just initialize the
|
|
GL context and draw a square.
|
|
</p>
|
|
<h2>Result</h2>
|
|
<div class="gl">
|
|
<canvas id="square" width="200" height="200"></canvas>
|
|
</div>
|
|
<p class="result_container"></p>
|
|
</div>
|
|
</body>
|
|
</html>
|
|
<!-- vim: set ts=4 sw=4: -->
|