Delete Icon
This forum is now read-only. Please use our new forums at discuss.codecademy.com.
0 points
Submitted by Maciej Wiercioch
6 years ago

Can I resize the animation?

If you want to use this animation in your own project then the predefined size (500px x 1000px) might be unsuitable.

To resize the animation (canvas element in fact) you have to change only one part of bubbles.js:

function updateCanvasDimensions() {
    canvas.attr({
        // change height and width to desired value
        height: 500,
        width: 1000
    });
    canvasWidth = canvas.width();
    canvasHeight = canvas.height();

    draw();
}

Return to Frequently Asked Questions

Answer 5506643795e378ed1e007b93

1 vote

Permalink

How do I put the bubbles.js file in my website? I am using TextWrangler.

829 points
Submitted by Jackson
6 years ago

Answer 545a69cc80ff33ffb7004a4b

0 votes

Permalink

where do you put this

328 points
Submitted by Adam Paylor
6 years ago

2 comments

Maciej Wiercioch 6 years ago

This is part of bubbles.js file (http://s3.amazonaws.com/codecademy-content/courses/hour-of-code/js/bubbles.js). To resize canvas you have to change values in lines 159 - 160 :)

Pranjal Jain 5 years ago

How to make it in %? I want to do it 100% width and 100% height