Step 1: From the Cloud9 dashboard: Create a new workspace
Fill in the following text boxes on the form:
→ Workspace name: card-maker Copy
→ Clone from Git or Mercurial URL: https://github.com/studentmrcode/card-maker.git Copy
Click Create workspace button
Open index.html and click Run
Step 2: Make separate variables for the card, title, paragraph, buttons, text box, color picker, and slider.
Hint: If you're having trouble, look at your Mad Libs project.
Step 3: Change the card's background color when the button is clicked.
Hint: Watch the setting style video. The video shows an example. Do NOT copy it exactly.
Step 4: Make two more buttons to change the card's background color.
inputevent listener to the text box so that the paragraph is updated as the user types:
inputevent listener to the color picker, and set the paragraph's color style to the selected color:
yourParagraphVariable.style.color = yourColorPickerVariable.value;
inputevent listener to the slider, and set the paragraph's font-size style to the slider value:
yourParagraphVariable.style.fontSize = yourSliderVariable.value + "px";