topical media & game development

talk show tell print

sample-canvas-particles.cfg / cfg



  <html>
  <head>
  

meta info & standard script(s)


  
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>HTML5 Canvas and Audio Experiment</title>
    
    <meta name="keywords" content="html5, canvas, experiment">
    <meta name="description" content="An html5 canvas experiment by 9elements.com">
    
    <link rel="image_src" href="sample-canvas-particles-preview.png">
  
    
    <script src="lib-present-graphic-processing-particles-files-processing.js" type="text/javascript" charset="utf-8"></script>
    <script src="lib-present-graphic-processing-particles-files-jquery-1.js" type="text/javascript" charset="utf-8"></script>
  <!--
    <script src="particles_files/processing.js" type="text/javascript" charset="utf-8"></script>
    <script src="particles_files/jquery-1.js" type="text/javascript" charset="utf-8"></script>
    <script src="particles_files/apt18.js" type="text/javascript" charset="utf-8"></script>
  -->
  
  

the script


    <script src="sample-canvas-particles.js" type="text/javascript" charset="utf-8"></script>
  
  

style(s)


    <style type="text/css" media="screen">
      body {
          background: #000;
          color: #aaa;
          font-family: Helvetica, sans-serif;
                  margin:0;
                  padding:0;
                  overflow:hidden;
      }
  
          a {
                  text-decoration:none;
          }
          
      #theapt {
      }
      #stuff {
                  postion:absolute;
      }
          #tweet {
                  font-family:Helvetica, Arial;
                  position:absolute;
                                  
                  top:400px;
                  left:260px;
                  
                  width:640px;
          }
          
          #tweet h1 {
                  display:block;
                  font-family:Helvetica, Arial;
                  font-size:40px;
                  font-weight:bold;
                  color:#fff;
                  margin:0 0 10px 0;
                  padding:0;
          }
          
          #tweet strong {
                  display:block;
                  font-size:16px;
          }
          
          #about {
                  font-size:11px;
                  position:absolute;
                  font-weight:normal;                
                  top:10px;
                  left:10px;
          }
  
          #about a {
                  color: #fff;
          }
    </style>
  </head>
  

canvas


  <canvas id="theapt" width="100%" height="100%" style="opacity:0.60"></canvas>
  <div unselectable="on" style="top: 220px; -moz-user-select: none; display: none;" id="tweet">
          LOADING
  </div>
  <div id="stuff">
          <audio src="lib-present-graphic-processing-thankyou.ogg" id="audio">  
  your browser does not support audio
          </audio>
  <!--
          <audio src="thankyou.ogg" id="audio">  
                  Your browser does not support the <code>audio</code> element.  
          </audio>
  -->
  </div>
  

author info


  <div style="left: 913px; top: 518px;" id="about"><a href="http://9elements.com/io/?p=153" title="cool software development?!">blog ยป</a></div>
  </body></html>
  


(C) Æliens 04/09/2009

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.