"Codecademy Animation"
Bootstrap 3.3.0 Snippet by Afhdez

Post to Facebook Tweet this

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!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> </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> </body> </html>
var myName = "Andres"; var red = [0, 100, 63]; var orange = [40, 100, 60]; var green = [75, 100, 40]; var blue = [196, 77, 55]; var purple = [280, 50, 60]; var letterColors = [red, orange, green, blue, purple]; drawName(myName, letterColors); if(10 < 2) { bubbleShape = 'square'; } else { bubbleShape = 'circle'; } bounceBubbles();

Related: See More

Argon Design System
Ripple Dot Animation
Success and Error Icon Animation
Bootstrap4 navigation border animation

Questions / Comments:

it was superb
but its is not responsive :(
can u help me pls

Hardik Gondhiya () - 7 years ago - Reply 0

Awesome! It's fun to play with it :D

Arshi () - 8 years ago - Reply 0