Thursday, December 18, 2014

QCC Trip - College visit and 3D printing workshop 



On December 17th, 2014, we went to a trip to visit Queens  Community College to get our College IDs and go to a 3D printing workshop.  First, we had breakfast to start off our day. Then, the juniors went to the 3D printing workshop while, seniors went to get our College IDs.



Then, we switched. In the 3D printing workshop, we learned how objects was made through a 3D printer. In order for that to happen, first, you have to make a sketch of the object you want to print online then, click print like you would do in a regular printer. The machine slowly started printing a 3D cup and it took a little while for it to be printed.
The 3D Printer
                                                                                                               
This cup is 3D printed.





We were shown 3D printed machines that were much more bigger than the one you see above.






                                                             College Tour

Later, we were given a college tour where we were shown the different departments the college has. QCC is really huge and has a place where students can relax after their classes. 
We were shown the holocaust exhibition where QCC displayed pictures, diary, etc. that ere donated to them by people that faced the holocaust. It was amazing to learn about QCC because they have a great faculty who tries their best to help students and works hard to create a great learning environment.

Monday, December 15, 2014

Lab 17- JavaScript/Jquery Included Together (Labs 11-16)

In lab 17, we had to included everything we learned through labs 12-16. In lab 12, we learned to create sliders where the information appears on the bottom when a user moves their mouse arrow on top of it. I did this by adding javascript where I included it to slide down and slide up. Through my labs, I added jquery to make my labs work.




 

   On the top of my HTML coding, I included all the CSS from my labs 12-16 including day and night, contact form, etc.



In lab 11, we had to create day/night where the background changed when a user clicked on the different buttons. The function "lightSwitch" stands for the day button, "darkSwitch" stands for the night button, and "resetSwitch" stand for the reset button.










In lab 13, we had to create a cloning where the image clones when a user click on it. Inside my javascipt, it says if the image is clicked, clone it and I included 6 images so, whenever a user clicks on one of these 6 images, it will clone it.



In lab 14, we had to create an article using blockquotes. Inside my CSS, I included the width of my article/blockquote. Uisng Javascript, I created the blockquotes and kept the function names the same 'span.co'. Inside, my article I used the tag <span class=co> </span> to create the blockquotes.

In lab 15, we learned to create contact form. inside the CSS, I told how I want it to look like defining the color, width, etc. I included the speed of it to appear inside my javascript script.





We learned to do so much using jquery/javascript and one of the things was to make the text appear fast/slow. I create two revealing text: slow revealing text and fast revealing text. Inside my javscript, I included "slow" function to appear slowly and "fast" function to appear fast.



In lab 16, we learned to make box adjustments. I made 5 box adjustments: increase, decrease, center, fade out, and fade in.





I kept the same function names: <button id="dec"> (Increase) , <button id="cen"> (Decrease) , <button class="btn1"> (Fade Out), and <button class="btn2"> (Fade In). Inside my javascript coding, I told what the button to do. For example, the "btn1" fadeOut and "btn2" fadeIn. In addition, "cen" decreases the box while, "inc" increases the box.

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.


Lab 15 - Contact Form

In lab 15, we had to create a contact form that a user can use to contact you. I created the contact form to let a user give me feedback or ask me questions. In order to send me a feedback/question, the user have to click the "Contact Me" button below my lab 15 page and fill out the information to submit it.




Inside my CSS, I include how I wanted my contact form to look defining the background color of it, width, etc. The div id "#contact" is for my contact form. 


I wrote the tag <div id="contact"> to tell it how I want my form to look like using CSS coding. I included name, email, and feedback/questions inside my contact form. I include jquery inside my lab 15 also.



 Inside my javascript, I include the speed of the contact form to appear.
                                          
 





As you can see, my contact form has the background color I told inside my CSS code and the user has to fill in their name, email, and feedback/questions to submit the form.
                                                                                                           


Lab 14 - Article

In lab 14, we had to create an article that included blockquotes. Basically, we had to put the main quotes from our article on a block next to our paragraph. As you can see, I added 2 blockquotes inside my web design design article. I did this using jquery and javascript.

Inside, my CSS, I made my article 600px width and my blockquote to be 35% width and which color I wanted it to be. Inside the <article> tag, I wrote my article about web designing and ended it with the </article> tag. To have a blockquote, I used the <span class=co> tag and wrote inside what I wanted to include inside the blockquote and ended my tag using </span>. At the bottom, I included the jquery to make my lab work.


My JavaScript

As you can see inside my javscript, I include the function name 'span.co' that is my blockquote.