John-liua / Hanoi-Tower

This is a website about the tower of Hanoi.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Hanoi-Tower

This is a website about the tower of Hanoi.

Workflow of navigation part

Only Mouse with Eyesight

  • See the top navigation.
  • Move mouse over the navigation bar with content you want.
  • Notice the color of the font and border change.
  • Click it and you can see the content you want.
  • If you want to play games,click “Play” navigation bar.
  • When you click “Play1”, you will enter the no-image game, please refer to workflow of no-image game.
  • When you click “Play2”, you will enter the visualized game, please refer to workflow of visualized game.

Keyboard and Eyesight

  • See the top navigation.
  • Tab selection onto the navigation bar with content you want.
  • Notice the color of the font and border changes.
  • Hit spacebar and you can see the content you want.
  • If you want to play games,select “Play” navigation bar and hit spacebar.
  • When you select “Play1” and hit spacebar, you will enter the no-image game, please refer to workflow of no-image game.
  • When you select “Play2” and hit spacebar, you will enter the visualized game, please refer to workflow of visualized game.

Keyboard with sceenreader

  • Open the sceenreader with Shortcut key.
  • Use shortcut keys to control the screenreader to read web pages.
  • Hear special words which repesenrt the content you want.
  • Hit spacebar jump to the corresponding content.
  • The screenreader reads the content and you determine whether it is what you want.
  • If not, exit the current web page and repeat until you hear what you want.
  • If you want to play games,control the screenreader to find “Play” navigation bar and hit spacebar.
  • When you hear “Play1” and hit spacebar, you will enter the no-image game, please refer to workflow of no-image game.
  • When you hear “Play2” and hit spacebar, you will enter the visualized game, please refer to workflow of visualized game.

Workflow of no-image game

Only Mouse with Eyesight

  • See the instructions and tips, try to understand it
  • See the strip that looks like textbox
  • Move mouse over textbox
  • Click up or down to enter the number(Just enter with your keyboard if you have.)
  • See the rectangles that looks like buttons
  • Click “Start” to initiate settings.
  • Click “NextStep” to learn the correct operation
  • Or Click six “FromXtoY”buttons to play the game
  • See the “Steps” until “Win” appears

Only Keyboard with Eyesight

  • Similar to only mouse with eyesight.
  • Using Tab to move downward, Shift + Tab to move upward instead of using mouse

Only Keyboard without Eyesight (Using Win 10 narrator)

  • Listen the instructions and tips, try to understand it
  • Press Tab moving to the input textbox
  • Enter a number
  • Press Tab moving to the button “Start”
  • Press Enter to initiate the settings
  • Press Tab moving to the button ”NextStep”
  • If you want to learn the correct step by step, press Enter
  • Else Tab to the game part
  • Press up and down to get the current state of the tree towers and to get how many steps had done
  • Press “FromXtoY” buttons to move the numbers
  • Do as above until you hear “Win!”

Workflow of visualization game

图片1

About

This is a website about the tower of Hanoi.


Languages

Language:HTML 84.7%Language:CSS 15.3%