Lab 16 - Box Adjustment

In lab 16, we had to create a button that did adjustments to a box. Inside, the box, we had to write about our favorite teachers and I wrote about Ms. Kaso and Dr. Liu because they inspired to keep on trying no matter what. The adjustments I added to my box was increase, decrease, center, fade in, and fade out.

Inside my CSS, I included how I wanted my box/buttons to look like defining its color and size. 

I created a <table> tag and inside it I included the box adjustments buttons. I added the <button id="dec"> (Increase) , <button id="cen"> (Decrease) , <button class="btn1"> (Fade Out), and <button class="btn2"> (Fade In). Inside the <div class="box"> tag, I wrote about my favorite teachers. I also attached the jquery inside my lab.

As you can see inside my javascript coding, I still have the same function names: <button id="dec"> (Increase) , <button id="cen"> (Decrease) , <button class="btn1"> (Fade Out), and <button class="btn2"> (Fade In). As you can see, the javascript coding telling what button does what. For example, the "btn1" fadeOut and "btn2" fadeIn. In addition,  "cen" decreases the box while, "inc" increases the box.