我对 JavaScript 很陌生，我正在尝试在这里重新创建这段代码：
效果： http ://www.clicktorelease.com/code/css3dclouds/
教程： http ://www.clicktorelease.com/tutorials/css3dclouds/#creating_a_world_and_a_camera
未捕获的 SyntaxError：意外的标识符
出于某种原因，我的第 25 行出了点问题，我不确定它是什么：
/*
Clears the DOM of previous clouds bases
and generates a new set of cloud bases
*/
function generate() {
objects = [];
layers = [];
if ( world.hasChildNodes() ) {
while ( world.childNodes.length >= 1 ) {
world.removeChild( world.firstChild );
}
}
for( var j = 0; j <; 5; j++ ) {
objects.push( createCloud() );
}
}
完整的 JavaScript：
(function() {
window.onload = function() {
/*
objects is an array of cloud bases
layers is an array of cloud layers
*/
var objects = [],
layers = [];
/*
Clears the DOM of previous clouds bases
and generates a new set of cloud bases
*/
function generate() {
objects = [];
layers = [];
if ( world.hasChildNodes() ) {
while ( world.childNodes.length >= 1 ) {
world.removeChild( world.firstChild );
}
}
for( var j = 0; j <; 5; j++ ) {
objects.push( createCloud() );
}
}
/*
Creates a single cloud base and adds several cloud layers.
Each cloud layer has random position ( x, y, z ), rotation (a)
and rotation speed (s). layers[] keeps track of those divs.
*/
function createCloud() {
var div = document.createElement( 'div' );
div.className = 'cloudBase';
var t = 'translateX( ' + random_x + 'px ) \
translateY( ' + random_y + 'px ) \
translateZ( ' + random_z + 'px )';
div.style.transform = t;
world.appendChild( div );
for( var j = 0; j < 5 + Math.round( Math.random() * 10 ); j++ ) {
var cloud = document.createElement( 'div' );
cloud.className = 'cloudLayer';
cloud.data = {
x: random_x,
y: random_y,
z: random_z,
a: random_a,
s: random_s
};
var t = 'translateX( ' + random_x + 'px ) \
translateY( ' + random_y + 'px ) \
translateZ( ' + random_z + 'px ) \
rotateZ( ' + random_a + 'deg ) \
scale( ' + random_s + ' )';
cloud.style.transform = t;
div.appendChild( cloud );
layers.push( cloud );
}
return div;
}
/*
Iterate layers[], update the rotation and apply the
inverse transformation currently applied to the world.
Notice the order in which rotations are applied.
*/
function update (){
for( var j = 0; j < layers.length; j++ ) {
var layer = layers[ j ];
layer.data.a += layer.data.speed;
var t = 'translateX( ' + layer.data.x + 'px ) \
translateY( ' + layer.data.y + 'px ) \
translateZ( ' + layer.data.z + 'px ) \
rotateY( ' + ( - worldYAngle ) + 'deg ) \
rotateX( ' + ( - worldXAngle ) + 'deg ) \
scale( ' + layer.data.s + ')';
layer.style.transform = t;
}
requestAnimationFrame( update );
}
}; //-window.onload
}());