diff --git a/js/three/threex.transparency.js b/js/three/threex.transparency.js
new file mode 100644
index 0000000..d3ce2bc
--- /dev/null
+++ b/js/three/threex.transparency.js
@@ -0,0 +1,56 @@
+var THREEx = THREEx || {}
+
+/**
+ * namespace for the extension
+ * @type {Object}
+ */
+THREEx.Transparency	= {};
+THREEx.Transparency.objects = [];
+
+/**
+ * init transparency of a object recursivly
+ * @param  {THREE.Object3D[]} objects the object which are transparent
+ */
+THREEx.Transparency.init	= function(objects){
+	objects.forEach(function(object){
+        THREEx.Transpaency.objects.push(object);
+		object.material.transparent	= true
+		object.material.depthWrite	= false
+	});
+}
+
+THREEx.Transparency.push = function() {
+    for (var i = 0; i < arguments.length; i++) {
+        THREEx.Transparency.objects.push(arguments[i]);
+        arguments[i].material.transparent = true;
+        arguments[i].material.depthWrite = false;
+    }
+}
+
+/**
+ * update the object for transparency rendering
+ * @param  {THREE.Object3D[]} objects the objects which are transparent
+ * @param  {THREE.Camera} camera the camera used for rendering
+ */
+THREEx.Transparency.update	= function(camera){
+	// update camera matrices
+	camera.updateMatrixWorld()
+	camera.matrixWorldInverse.getInverse( camera.matrixWorld )
+
+	var screenMatrix= new THREE.Matrix4().multiplyMatrices(camera.projectionMatrix, camera.matrixWorldInverse)
+	var position	= new THREE.Vector3()
+
+	// traverse the object
+	THREEx.Transparency.objects.forEach(function(object){
+		// update the matrixWorld of the object and its children
+		object.updateMatrixWorld()
+		// compute its position in screen space
+		position.setFromMatrixPosition( object.matrixWorld );
+        // object.matrixWorld.setMatrixFromPosition(position);
+		position.applyProjection( screenMatrix );
+		// use the position.x as renderDepth
+		object.renderDepth	= position.z;
+	})
+}
+
+