<html>
<style type="text/css">
input.box {background-color:#ffffff;color:#000000;border:1px solid #f0f0f0;text-align:right}
input.box3 {background-color:#ffffff;color:#000000;border:none;text-align:center}
input.box2 {background-color:#ffffff;color:#000000;border:1px solid #f0f0f0;text-align:right}
input.box4 {background-color:#ffffff;color:#000000;border:none;text-align:right}
</style>
</html>
{| {{sys:table:noborder}}
|(
|<html><input type="text" size="4" disabled="disabled" value="width" class="box4"/></html>
|/
|<html><input type="text" size="4" disabled="disabled" value="height" class="box4"/></html>
|)
|*
|<html><input type="text" size="4"disabled="disabled" value="size" class="box4"/></html>
|<html><input type="text" size="2" disabled="disabled" value="=" class="box3"/></html>
|<html><input type="text" value="capwidth" disabled="disabled" size="7" class="box4"/></html>
|-
|(
|<html><input type="text" id="width" size="4" class="box"/></html>
|/
|<html><input type="text" id="height" size="4" class="box"/></html>
|)
|*
|<html><input type="text" id="size" value="150" size="4" class="box"/></html>
|<html><input type="button" id="calc" value="=" /></html>
|<html><input type="text" id="capwidth" size="4" class="box" disabled="disabled"/></html>
|}
<html>
<script type="text/javascript">
document.getElementById('calc').onclick= function() {
document.getElementById('capwidth').value=Math.floor((document.getElementById('width').value/document.getElementById('height').value)*document.getElementById('size').value);
}
</script>
</html>
Voorbeeld