O'Reilly logo

WebGL Beginner's Guide by Brandon Jones, Diego Cantor

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Time for action — creating a transparent wall

  1. Open ch6_Transparency_Initial.html in your HTML5 web browser. We have two completely opaque objects: a cone behind a wall. Click-and-drag on the canvas to move the camera behind the wall and see the cone as shown in the following screenshot:
    Time for action — creating a transparent wall
  2. Change the wall alpha value by using the provided slider.
  3. As you can see, modifying the alpha value does not produce any transparency. The reason for this is that the alpha blending is not being enabled. Let's edit the source code and include alpha blending. Open the file ch6_Transparency_Initial.html using your preferred source code editor. Scroll to the configure ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required