私のウェブページには、画像とキャンバスの2つが読み込まれます。
ページが読み込まれると、ウェブページに画像が読み込まれます。どこかをクリックすると、ページがキャンバスをロードします。
今、私は写真をクリックすると何かが起こるのですが、画像がクリックされたときにonclick->と言うことができます。
写真のIDで作業できると思います。しかし、画像を作成するときに、JavaScriptでiDをどのように提供しますか?
<script type="text/javascript">
function start() {
var vierkant = document.getElementById("Vierkant");
initWebGL(vierkant); // Initialize the GL context
// Only continue if WebGL is available and working
if (gl) {
gl.clearColor(0.0, 0.0, 5.0, 1.0); // Set clear color to black, fully opaque
gl.enable(gl.DEPTH_TEST); // Enable depth testing
gl.depthFunc(gl.LEQUAL); // Near things obscure far things
gl.clear(gl.COLOR_BUFFER_BIT|gl.DEPTH_BUFFER_BIT); // Clear the color as well as the depth buffer.
}
}
function startImage()
{
var img = document.createElement("img");
img.src = "Bus_Stop_2.png";
document.body.appendChild( img );
img.
}
function initWebGL(vierkant) {
// Initialize the global variable gl to null.
gl = null;
try {
// Try to grab the standard context. If it fails, fallback to experimental.
gl = vierkant.getContext("webgl") || vierkant.getContext("experimental-webgl");
}
catch(e) {}
// If we don't have a GL context, give up now
if (!gl) {
alert("Unable to initialize your 'Vierkant'.");
}
}
</script>
<body onclick="start()" onload="startImage()">
<canvas id="Vierkant" width="640" height="480">
Your browser doesn't appear to support the HTML5 <code><canvas></code> element.
</canvas>
</body>