ThreeJSExperiment#1

HTML

<script src="http://threejs.org/build/three.min.js"></script>
<script src="http://threejs.org/examples/js/controls/OrbitControls.js"></script>
<script src="http://threejs.org/examples/js/renderers/CSS3DRenderer.js"></script>
<script src="http://threejs.org/examples/js/controls/TrackballControls.js"></script>

CSS

body {
    background-color: #000;
    margin: 0px;
    overflow: hidden;
}

JavaScript

var camera, scene, renderer;
			var scene2, renderer2;
			var controls;
			init();
			animate();
			function init() {
				camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 1000 );
				camera.position.set( 200, 200, 200 );
				controls = new THREE.TrackballControls( camera );
				scene = new THREE.Scene();
				scene2 = new THREE.Scene();
				var material = new THREE.MeshBasicMaterial( { color: 0xff0000, side: THREE.DoubleSide } );
				//

        //
				for ( var i = 0; i < 1; i ++ ) {
					var element = document.createElement( 'iframe' );
          element.src = 'https://www.youtube.com/embed/Wnt9ploV6SI';
					element.style.width = '100px';
					element.style.height = '100px';
					element.style.background = new THREE.Color( Math.random() * 0xffffff ).getStyle();
					var object = new THREE.CSS3DObject( element );
					object.position.x = Math.random() * 200 - 100;
					object.position.y = Math.random() * 200 - 100;
					object.position.z = Math.random() * 200 - 100;
					object.rotation.x = Math.random();
					object.rotation.y = Math.random();
					object.rotation.z = Math.random();
					object.scale.x = Math.random() + 0.5;
					object.scale.y = Math.random() + 0.5;
					scene2.add( object );

					var geometry = new THREE.PlaneGeometry( 100, 100 );
					var mesh = new THREE.Mesh( geometry, material );
					mesh.position.copy( object.position );
					mesh.rotation.copy( object.rotation + Math.PI/4 );
					mesh.scale.copy( object.scale );
					scene.add( mesh );
				}
				//
        var sides = [
          {
            url: 'http://threejs.org/examples/textures/cube/skybox/px.jpg',
            position: [ -1024, 0, 0 ],
            rotation: [ 0, Math.PI / 2, 0 ]
          },
          {
            url: 'http://threejs.org/examples/textures/cube/skybox/nx.jpg',
            position: [ 1024, 0, 0 ],
            rotation: [ 0, -Math.PI / 2, 0 ]
          },
          {
            url:...