title: How to do transparency with WebGL/OpenGLES - transparent outer object *enclosing* inner object
body: <p>I'm trying to work out a strategy for transparency using WebGL, to support the case of a transparent object that <em>encloses</em> another.</p>
  
  <p>As described over at <a href="http://learningwebgl.com/blog/?p=859" rel="nofollow noreferrer">http://learningwebgl.com/blog/?p=859</a>, conceptually we can</p>
  
  <ol>
  <li>Render background</li>
  <li>Enable blending and disable depth test</li>
  <li>Render foreground</li>
  </ol>
  
  <p>I'm a little naive here, and I'd appreciate a seasoned graphics pro to set me right. Traditionally (with fixed function pipeline), I suppose I would decompose those objects into a list of faces, depth-sort them, then render them in far-to-near order while enabling/disabling blend/depth on a per-face basis.</p>
  
  <p>But how to do transparency in this case using WebGL, where we load entire geometries onto the GPU as monolithic VBOs?</p>
  
  <p>Anyone have any technical hints or links?</p>
  
  <p>cheers,
  Lindsay</p>