index.html

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>Emotion API</title>
    <link rel="stylesheet" href="css/site.css">
    <script src="scripts/jquery-3.1.0.min.js"></script>
    <script src="scripts/script.js"></script>
</head>
<body>
    <div>
        <h1>Microsoft Cognitive Services</h1>
        <h2>Emotion API Sample</h2>
        <!--Enter Image URL-->
        <!-- <input type="url" id="imageUrlTextbox" class="urlinput"> -->
    </div>

    <!-- <div class='table'>
        <table align='right'>
            <tr> -->
                <!-- <td class="OutputTh">
                    
                    <div id="OutputDiv"></div>
                </td> -->
                <!-- <td> -->
                    <!--Output Image-->            
                    <!-- <div id="PhotoDiv">
                    <img id="ImageToAnalyze">
                    <img src="image/Rectangle.png" id="Rectangle">
                    </div>
                </td>
            </tr>
        </table> -->
    

    </div>
    <!--webcamJS-->
    <script src="webcamjs/webcam.js"></script>

    <div id="my_camera" style="width:320px; height:240px;"></div>
    <div id="my_result"></div>
    <br><div class="buttons">
        <button class="buttons" id='ok' type="button"></button>
        <button class="buttons" id='redo' type="button"></button>
        <button class="buttons" id='redoredo' type="button"></button>
    </div>


    <script language="JavaScript">

    </script>
    <br><div class='phototake'>
        <a id="cameraButton">Take Snapshot</a>
    </div>

    <div class='result_div'></div>
</body>
</html>