Last active
September 22, 2015 16:34
-
-
Save jbrown17/98af98516f0a3709928d to your computer and use it in GitHub Desktop.
Calculate your body's golden ratio. HTML / JS without CSS styling
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title>Golden Ratio</title> | |
| </head> | |
| <body> | |
| <script> | |
| function calculateRatio(){ | |
| var wrist = document.getElementById("wrist").value; | |
| var waist = document.getElementById("waist").value; | |
| var knee = document.getElementById("knee").value; | |
| var idealArms = (2.5*wrist); | |
| var idealCalves = idealArms; | |
| var idealShoulders = (1.618*waist); | |
| var idealChest = (6.5*wrist); | |
| var idealThigh = (1.75*knee); | |
| document.getElementById("results").innerHTML = '<ul style="list-style-type:none"><li>arm size:'+idealArms+' in.</li><li>calf size: '+idealCalves+' in.</li><li>shoulder size: '+idealShoulders+' in.</li><li>chest size: '+idealChest+' in.</li><li>thigh size: '+idealThigh+' in.</li></ul>'; | |
| } | |
| </script> | |
| <form> | |
| <legend>Golden Ratio (inches)</legend> | |
| <fieldset> | |
| <div> | |
| <label for="wrist">Wrist:</label> | |
| <input type="text" id="wrist"> | |
| </div> | |
| <div> | |
| <label for="waist">Waist:</label> | |
| <input type="text" id="waist"> | |
| </div> | |
| <div> | |
| <label for="knee">Knee:</label> | |
| <input type="text" id="knee"> | |
| </div> | |
| <div class="button"> | |
| <button type="button" onclick="calculateRatio()">Calculate Ratio</button> | |
| </div> | |
| </fieldset> | |
| </form> | |
| <div id="results"></div> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment