Sandy Demi
a08dc07fd7
Use Arial and center text. Increase the size of the plus and equals signs. Add text above final answer.
90 linhas
4.2 KiB
HTML
90 linhas
4.2 KiB
HTML
<head>
|
|
<title>Fraction Addition</title>
|
|
<meta http-equiv="cache-control" content="no-cache">
|
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
|
<link rel="stylesheet" href="https://cdn.ctat.cs.cmu.edu/releases/latest/CTAT.min.css"/>
|
|
<script src="https://cdn.ctat.cs.cmu.edu/releases/latest/jquery.min.js"></script>
|
|
<script src="https://cdn.ctat.cs.cmu.edu/releases/latest/ctat.min.js"></script>
|
|
<script src="https://cdn.ctat.cs.cmu.edu/releases/latest/ctatloader.js"></script>
|
|
<script>
|
|
function ctatOnload() {
|
|
initTutor({"question_file":'FractionAddition.brd'});
|
|
};
|
|
</script>
|
|
<style type="text/css">
|
|
.CTATTextInput input { text-align: center; }
|
|
.CTATTextInput { font-family: Arial; font-size:20px; width: 34px; height: 30px; margin: 0px 5px 2px 5px; }
|
|
.misc-text { text-align: center; font-family: Arial; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div style="position:relative; width: 640px; height: 500px; border: 1px solid black; margin: 0 auto; overflow: hidden;">
|
|
<div style="float: left; width: 270px;">
|
|
<div id="givensPlus" class="misc-text" style="font-size: 20px; position: absolute; left: 15px; top: 180px;">+</div>
|
|
<div class="misc-text" style="font-size:small; position:absolute; left: 36px; top:18px;">Given<br/>Fractions</div>
|
|
<div style="position: absolute; left: 40px; top: 52px;">
|
|
<div>
|
|
<div id="firstNumGiven" class="CTATTextInput"></div>
|
|
<hr class="fraction-bar"/>
|
|
<div id="firstDenGiven" class="CTATTextInput"></div>
|
|
</div>
|
|
<br/>
|
|
|
|
<div style="position: absolute: left: 40px; top: 110px;">
|
|
<div id="secNumGiven" class="CTATTextInput"></div>
|
|
<hr class="fraction-bar"/>
|
|
<div id="secDenGiven" class="CTATTextInput"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="firstConvEq" class="misc-text" style="font-size: 20px; position: absolute; left: 95px; top: 80px;">=</div>
|
|
<div id="secConvEq" class="misc-text" style="font-size: 20px; position: absolute; left: 95px; top: 180px;">=</div>
|
|
|
|
<div class="misc-text" style="font-size:small; position:absolute; top:18px; left: 114px;">Converted<br/>Fractions</div>
|
|
<div style="position: absolute; top: 52px; left: 120px;">
|
|
<div>
|
|
<div id="firstNumConv" class="CTATTextInput" tabindex="4"></div>
|
|
<hr class="fraction-bar"/>
|
|
<div id="firstDenConv" class="CTATTextInput" tabindex="1"></div>
|
|
</div>
|
|
<br/>
|
|
<div>
|
|
<div id="secNumConv" class="CTATTextInput" tabindex="5"></div>
|
|
<hr class="fraction-bar"/>
|
|
<div id="secDenConv" class="CTATTextInput" tabindex="2"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="ans" style="position: absolute; top: 250px; left: 120px;">
|
|
<div id="ansNum1" class="CTATTextInput" tabindex="6"></div>
|
|
<hr class="fraction-bar"/>
|
|
<div id="ansDen1" class="CTATTextInput" tabindex="3"></div>
|
|
</div>
|
|
|
|
<div class="misc-text" style="font-size:small; position:absolute; top:217px; left: 195px;">Simplified<br/>Answer</div>
|
|
<div id="finalEq" class="misc-text" style="font-size: 20px; position: absolute; left: 175px; top: 279px;">=</div>
|
|
<div style="position: absolute; top: 250px; left: 200px">
|
|
<div id="ansNumFinal1" class="CTATTextInput" tabindex="8"></div>
|
|
<hr class="fraction-bar"/>
|
|
<div id="ansDenFinal1" class="CTATTextInput" tabindex="7"></div>
|
|
</div>
|
|
<div style="position: absolute; bottom: 0; width: 200px; left: 35px;">
|
|
<p class="misc-text" style="font-size: large; font-weight: bold;">Perform the Fraction Addition Problem</p>
|
|
<p class="misc-text" style="font-weight: bold; font-size: 0.9em;">To get tutor help, click on the Hint and Next buttons.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div style="float: right; width: 350px; height: 100%; padding: 10px; background-color: ghostwhite; border-left: 2px solid grey;">
|
|
<div id="skills" class="CTATSkillWindow" style="width: 100%;" data-ctat-threshold="0.85"></div>
|
|
<br>
|
|
<div id="HintWindow" class="CTATHintWindow" style="width: 100%;"></div>
|
|
<br>
|
|
<div style="display:flex; justify-content:space-around">
|
|
<div id="done" class="CTATDoneButton" tabindex="9" style=""></div>
|
|
<div id="hint" class="CTATHintButton" tabindex="10" style=""></div>
|
|
</div>
|
|
</div>
|
|
<br>
|
|
</div>
|
|
</body>
|