I recently published Version 1.0 of my Interactive Periodic Table in JavaScript and in this brief post I will describe the enhancements for Version 1.1.
You can download the source code as a zip file or clone/download the Github repository via the links below.
Source Code Links
Firstly, I have added a few extra pieces of information about each element. These are:
- State of matter: at 0°C and 1 atm of pressure
- Occurrence: primordial, from decay or synthetic
- Standard atomic weight: in addition to the average already listed
- Group: the column of the periodic table
- Period: the row of the periodic table
The basic periodic table displays four pieces of information about each element: name, atomic number, chemical symbol and conventional atomic weight. However, we now have eleven items of data for each element so to make them accessible I have now set them as the title attribute of each <td> in the periodic table. This means that if you mouseover an element you will see all the data as a popup as shown below. (These are browser-generated so yours might look slightly different.)
Clicking an element will show a larger centred window with the same data, an example of which is shown below.
That is all for now but I have a long "to do" list for this project so further enhancements will be coming along soon.