Maths worksheet generator

 Continuing the discussion about maths games for children, I wrote a webpage which will generate worksheet in Arithmetic with 30 sums in simple arithmetic operations. You can select which operation. And you can select upper limit. The sums generated are random.

Here is how it looks like.


Hope it will be useful for teachers and parents. 

This was written using HTML and Javascript. Here is the HTML of the page


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
 
<style type="text/css">
  .box{
      margin-top: 50px;
      float:left;
      width:25%;
      padding: 10px;
      margin: 10px;
      font-size: 18px;
      background-color: #ccc;
      box-shadow :2px 2px #eeeeee;
      text-align: center;
</style>
<script type="text/javascript">
   function showQuestion() {
        var typeSel = document.getElementById("type").value
        var typeVal="??"
        switch(typeSel) {
          case  "Addition":typeVal = " + ";break
           case "Subtraction":typeVal = " - ";break      	
          case  "Multiplication":typeVal = " * ";break
          case  "Division":typeVal = " &#47 ";break;
        }
        var str = "";
        var inputrange = document.getElementById("range")
        var range = inputrange.value
        for(i=1;i<10;i++){ 
        var n1 = Math.floor(Math.random()*range);
        var n2 = Math.floor(Math.random()*range);
        if(n1<n2){
           t1 = n1;n1 = n2;n2 = t1         
        }
        str = str+n1 +typeVal+n2+"=<br><br>" ;
        }
        var qnBox = document.getElementById('qn1');
        qnBox.innerHTML =str;
        str = ""
         for(i=1;i<10;i++){ 
        var n1 = Math.floor(Math.random()*range);
        var n2 = Math.floor(Math.random()*range);
          if(n1<n2){
           t1 = n1;n1 = n2;n2 = t1         
        }
        str = str+n1 +typeVal+n2+"=<br><br>" ;
        }
          qnBox = document.getElementById('qn2');
        qnBox.innerHTML =str;
         str = ""
         for(i=1;i<10;i++){ 
        var n1 = Math.floor(Math.random()*range);
        var n2 = Math.floor(Math.random()*range);
          if(n1<n2){
           t1 = n1;n1 = n2;n2 = t1         
        }
        str = str+n1 +typeVal+n2+"=<br><br>" ;
        }
          qnBox = document.getElementById('qn3');
        qnBox.innerHTML =str;
        hideElements()        
         
   }
 
   function hideElements(){
        var qnFormat = document.getElementById("qnFormat")
        qnFormat.style.visibility ='hidden'
        
   }
</script>
</head>
<body>
<div id = "qnFormat">
<p  >
    Max.Number:<input   id="range">
    Type: <select id="type">
			<option value="Addition">Addition</option>
			<option value="Subtraction">Subtraction</option>
			<option value="Multiplication">Multiplication</option>
			<option value="Division">Division</option>    
    </select>
    <button name="start" type="button" onclick="showQuestion()">Create worksheet</button>
    </p></div>
     <div class = "box" id="qn1"></div>
     <div class = "box" id="qn2"></div>
     <div class = "box" id="qn3"></div>
   
</body>
</html>

I will be adding other pages with other worksheets in Maths soon.

Comments

Popular posts from this blog

ಹೂಗಳು

ಎಮ್ಮೆ

Not for nation