Demo Interactions


Hello and welcome to our learning page. Below in each
box are different types of interactions that you will find while you utilize
the web for your work. To test out each interaction just follow the
instructions in bold within each box.

Move your mouse over the text below to see a hover effect
these are used on sites to display extra information to the user.

Hover here to see a info box!I am a hover box that is displayed when you put your mouse over the text, hello nice to meet you :-)

Clicking the button below will launch an alert window,
these types of alerts are commonly used to prompt a user before submitting
information on a webpage.

Clicking the button below will launch an alert window,
these types of alerts are commonly used to prompt a user before submitting
information on a webpage. This button requires two click one after another
for the alert to launch.

Some sites do not like (or allow) you to copy text on their webpages
trying to select the text below or anywhere on the page will give you an alert
similar to how some sites alert you.

Some test text for you to select

Some sites alert you or give popups when you mouse over certain area's
on pages, recently advertisers will have popups tied to words on the pages
you are ready so when you mouse over them a popup with an advertisement comes up.

Mouseover me

Almost every site online highlights links to other pages
when you mouseover them. Site do this to better indicate where links
are within their webpages.

Hover over me

By typing in the box below an alert will instantly
come up, usually sites do this when what you enter is invalid
or not what they want entered.

Enter a character:

By typing in the box below an alert will
come up, usually sites do this when what you enter is invalid
or not what they want entered.

Enter a character:

All sites track users to better streamline their site, this
is usually done behind the scenes without your interaction
however below is an example of what many sites do which is
track how long visitors stay on their pages.

Time you have been on this page:

  • Instructions:

    • 1.) Navigate to http://youtube.com/.

    • 2.) Type in what you are looking for in the search bar at the top of the page and click the magnifying glass.

    • 3.) Browse through the search results and click on the video you would like to watch. You will then be taken to the video's page. Sit back and enjoy!

  • Instructions:

    • 1.) Navigate to the page where the image is located on.

    • 2.) Move your mouse over the image and "right-click" with your mouse on the image.

    • 3.) A mini menu will popup move your mouse over the option that says "save / save as" and "left-click" it with your mouse. Your image has been saved.

  • Instructions:

    Many sites make you perform a certain test before you can submit data to stop their sites from getting spammed. Below is an example of a simple one.

    What does 2 + 2 equal?

Many sites have animations, below is just a simple demo that changes the wallpaper to different colors.

Press the button below to see the background color change:

Many sites have links to external sites, below is a simple link that opens a new browser tab to google.com

Press the button below to see Google open in a new tab:


Many sites allow the users to interact with their sites in unique ways. Below is an
example of a sketchpad that allows you to draw on it. Features like these are becoming more and
more common as sites update themselves to bring new features to their users.

Click and hold to draw in the box below:

Below is an another example of information that sites can collect about you.
Below is your browser information:

CCBot/2.0 (https://commoncrawl.org/faq/)

Below is an another example of information that sites can collect about you.
Below is your browser ip:

52.201.27.211