Posts

Showing posts from December, 2019

Project #2 - Shark Tank

Project #2 was called Shark Tank. This is very similar to the tv show Shark Tank where businesses are revealed to the shark tank to judge them and see if they have something profitable. For this project, we were instructed to make websites for client businesses. We first interviewed everyone's companies which gave us a basic idea as to what everyone's company was about. Then, we were to create websites for two of them which were given to us as clients. We were basically a marketing team to try and sell them a website that they would approve of as sharks. Our team was called FilTier Marketing Co. This website was to advertise their product and it would have to be a website worth selling to them. The two clients that my group was assigned were Love and STCS.  So let's start with how we went about designing Love first. Their company's goal was pretty simple. They wanted to increase the fundings for teachers in order to enhance the quality of their education. We mad...

Lab #6 - JQ Stop

This lab was an add-on to lab #5 which was jQuery animate. Continuing from my last webpage, I had made buttons to move, change the size, opacity, do it all, and alter the shape of a white div box on the webpage. There was also a reset button that makes all of the modifications on the white div box change. Now, for this lab the objective was to add a stop button to all of the animations. What this button would do is completely stop any animation in progress. For example, if I press the size button and then press the stop button, it should stop the size modification while it is happening and basically freeze the action. This can be done for all of the animations. Easily, this button was made with a .stop() function in jQuery. Once applied to the selector, this method allows for when this click function runs, to stop any animations currently in process. I've tested it with all of the animations and it currently works for all of them. This can be useful to the web designer's ar...

Lab #5 - jQuery Animate

In lab #5, I used jQuery to animate a div and manipulate it to move, change the shape, size, and opacity of it. Each button you click does the action that it says. The buttons consist of move, size, opacity, cascade, shape and reset. Clicking on the move button will move the div square to the right a certain amount. Clicking it multiple times with make it keep going to the right until it goes off the page. The size button makes the div square become smaller. The opacity button randomly sets the opacity of the div square between 0 and 1. The cascade button combines the first 3 buttons and does all of them. The shape button changes the shape of the div square to make it more circular, like an oval. The reset button undoes all of the applied actions done with the previous buttons. First of all, every single button on this page is animated with jQuery, so its easiest to make an onclick function, which runs whenever the button is clicked. So when any of the buttons are clicked, they sele...

Lab #4 - Ninja

In lab #4, I used HTML, CSS, javascript, and jQuery to create a ninja that could do 3 different actions. This ninja could also be renamed, and have other details described about him. When you click one of the action buttons, it would produce a sound related to that action. It would also display how many times the character did that action. To do all of this, I first found an image of a ninja from the internet. I then put it in my document using an <img> tag. From there I proceeded to make 3 buttons for the actions in my HTML document. I then created an on click function in jQuery to make the buttons work. I created audio tags in my HTML document to hold the sounds that I wanted to use for the buttons. I then linked the audio with the buttons so that when you click them it would play. I also created another button for you to give details about the ninja which would then be displayed after inputting the information. Lastly, I added another <p> tag with empty text so that w...