Dixin Bao's Web Portfolio

Hello all, I'm Dixin Bao. I come from Beijing, China. Currently, I'm studying at Hobart and William Smith Colleges, majoring in Architectural studies and minoring in Mathematics.

This website is designed for my Computer Science course CS120. It consists most of my lab assignments, such as websiye design by using HTML and CSS, JavaScript Programming, JQuery techniques, and some AJAX...etc. CLick each of the links below, you will see a alot of different as well as interesting stuffs.

My 1st Web Page

Welcome to the first lab for CPSC 120. In this lab, I create my first web page by using HTML and some CSS.

Art Cares

As an assignment, I make another web page. To make things definite, I imagine that I am creating a web page for some organization, or to provide information on some topic, or to support some cause.

Simple Slideshow

This web page is a very simple "slide show." It will display one image, and it will have several buttons. Clicking on any one of the buttons will replace the image with a different image.

Style Picker

This assignment is to make another complete web page with several buttons. Clicking on a button should make several changes to the entire web page. For example, one button might show the page as white text on a black background with a yellow heading, while another might show dark red text on a light yellow background, and so on.

HWS Math Prizers

For this lab, I convert an overly long web page into a multipage web site. I also practice my CSS skills by adding style to the web site. The page is a list of student prizes that have been awarded by the Department of Mathematics and Computer Science.

Animation

This exercise deals with animation. It has buttons to start and stop the animation and to clear the canvas. The animation draws a series of circles growing outwards from a center point.

Move Your Mouse

I fill in the two function definitions to do certain drawing on the canvas.

Press Your Arrow Keys

This file is set up to respond to key presses on the up-, down-, left-, and right-arrow keys, as well as on the space key. Pressing the space bar should clear the picture and move the square back to its original position at the center of the canvas.

1st JavaScript Drawing

This lab introduces the "canvas" element, a recent addition to HTML that allows JavaScript to draw pictures on a web page.

Flip a Coin

This lab is a nice coin flipping application: When you click the button, you see the question mark for 2 seconds. After two seconds, it is replaced by either heads or tails.

Loopy Art

In this lab, I return to drawing on a canvas. The goal is to produce random works of abstract "art." The programming requirement is to use for loops to do it.

GIMP Images

My assignment for this lab is to produce five images using Gimp and to make a web page to display those images.

Move Your Mouse over the Words

The goal of this lab is to start using JQuery, and in particular JQuery events and JQuery animations. I make each of the words on a page jump out of the way when the mouse is moved over it.

Want to Have a Bet

In Lab 6, I wrote a short JavaScript program for flipping a coin. In this exercise, I create an animated version using JQuery.

Some Jquery Technique

Click each title, then you will see what happens. They are all made by JQuery functions

Here is a poll, VOTE !!!

Here is a poll made by server-side programming, PHP. After you vote, you can see the result received from the dadabase.