var red = [0, 100, 63];
var orange = [40, 100, 60];
var green = [75, 52, 40];
var blue = [196, 77, 55];
var purple = [280, 50, 60];
var blue1 = [180, 90, 24];
var blue2 = [180, 51, 24];
var blue3 = [202, 51, 65];
var blue4 = [202, 0, 65];
var worm = [38, 52, 52];
var tail = [202, 14, 65];
var body1 = [202, 14, 55];
var body2 = [202, 14, 45];
var body3 = [202, 14, 35];
var body4 = [202, 14, 25];

var myName = "><(((('> ~";
var letterColors = [tail,tail,body1,body2,body3,body4,orange,red, worm];
if (99 < 0) {
    bubbleShape = "square";
} else {
    bubbleShape = "circle";
}

drawName(myName, letterColors);
bounceBubbles();
<!DOCTYPE html>
<html>
  <head>
    <script type="text/javascript" src="//code.jquery.com/jquery-1.10.2.min.js"></script>
    <script type="text/javascript" src="http://s3.amazonaws.com/codecademy-content/courses/hour-of-code/js/alphabet.js"></script>
    <style>
        #footer {
        	position: relative;
        	height: 150px;
        	background: #f0b7a1; /* Old browsers */
        	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2YwYjdhMSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjY5JSIgc3RvcC1jb2xvcj0iIzhjMzMxMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjkxJSIgc3RvcC1jb2xvcj0iI2JmNmU0ZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
        }
        .lyrics {
            font-family: sans-serif;
            font-size: 1.2em;
            text-align: center;
            text-shadow: 0 0 30px rgba(0, 255, 255, 1);
        }

    </style>

  </head>
  <body>
    <canvas id="myCanvas"></canvas>
    <script type="text/javascript" src="http://s3.amazonaws.com/codecademy-content/courses/hour-of-code/js/bubbles.js"></script>
    <script type="text/javascript" src="main.js"></script>
    <p class="lyrics">Down by the seaside -- See the boats go sailing -- Can the people hear -- What the little fish are saying?</p>
    <div id="footer"></div>
  </body>
</html>
Created from scratch
6 forks
176 views

Browse more Codebits