Sound transfers into the ear canal and causes the eardrum to move.
The eardrum will vibrate with vibrates with the different sounds.
These sound vibrations make their way through the ossicles (malleus, incus & stapes) to the cochlea.
Sound vibrations make the fluid in the cochlea travel like ocean waves.
Movement of fluid in turn makes the hair cells The auditory nerve picks up any neural signals created by the hair cells. Hair cells at one end of the cochlea transfer low pitch sound information and hair cells at the opposite end transfer high pitch sound information.
The auditory nerve moves signals to the brain where they are then translated into recognizable and meaningful sounds. It is the brain that “hears”.
Hovering over the highlighted areas in the ear diagram will change the colour of the svg and display the text labels of the ear part. This is done by changing the attribute of svg elements using 'setAttributeNS()'
By clicking on the names of the ear part, a desciption will appear on the right hand side of the diagram. This is done by changing the attribute of svg elements using 'innerHTML'
By clicking 'Play Music', music will start playing an the ear animation will start. This is done with built-in 'play()' function. The animation is done with css by using the 'shake' animation. This works without needing to do the instructions above.
By clicking 'Pause Music', the music will be paused and the animation will stop until 'Play Music' is pressed again. This is done with built-in 'pause()' function. Animation stops by setting no class to the svg elements. When 'Play Music' is pressed again, the music will continue from where it was paused.
The first slidehow allows you to view how sound travels in the ear. I used my code from my ECS417 project
Next to this slideshow is a video example of the how sound travels through the ear.
Using 'ol' tag to create a small summary of how the ear hears sound.
Basilar Membrane:
By clicking on 'Cochlear Duct', 'Basilar Membrane' and 'Apex' on the second svg diagram, information will pop up on the right hand side of the diagram. This is done by changing the attribute of svg elements using 'innerHTML'.
Hovering over different parts of the 'Cochlear Duct' will change the colour of the areas and display an image on the right hand side of the svg element. This is done by changing the attribute of svg elements using 'setAttributeNS()' for both changing colour of area and display image. (I have done this correctly in my code but I am not sure why it won't work, I am not getting any errors so I'm not sure why it doesn't work. Slideshow show how it should look).
Slideshow gives more detail to the Cochlear Duct and where frequency ranges are picked up in the Cochlea.
Next to this slideshow is a video example of the how sound travels in the Cochlea and Basilar Membrane.
Information about the ear used in the page is from these sites: Site 1, Site 2
