{"id":2197,"date":"2026-05-12T05:51:48","date_gmt":"2026-05-12T05:51:48","guid":{"rendered":"https:\/\/withifi.muhubonurture.nl\/?p=2197"},"modified":"2026-05-12T06:31:10","modified_gmt":"2026-05-12T06:31:10","slug":"plus-sommen-tot-5","status":"publish","type":"post","link":"https:\/\/withifi.muhubonurture.nl\/?p=2197","title":{"rendered":"Plus Sommen Tot 5"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"2197\" class=\"elementor elementor-2197\" data-elementor-post-type=\"post\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b6e3a14 e-con-full e-flex e-con e-parent\" data-id=\"b6e3a14\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-bac59df elementor-widget elementor-widget-html\" data-id=\"bac59df\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\nbody{\r\n  margin:0;\r\n  font-family:'Inter',sans-serif;\r\n}\r\n\r\n\/* PAGINA *\/\r\n\r\n.sommen-page{\r\n  min-height:100vh;\r\n  padding:6rem 6vw;\r\n\r\n  background:\r\n    radial-gradient(circle at 18% 20%, rgba(255,255,255,0.78) 0%, transparent 30%),\r\n    radial-gradient(circle at 82% 28%, rgba(255,228,196,0.35) 0%, transparent 32%),\r\n    radial-gradient(circle at 50% 82%, rgba(255,244,228,0.42) 0%, transparent 36%),\r\n    linear-gradient(135deg,#F9FBF8 0%,#EEF7F3 45%,#F7FBF8 100%);\r\n\r\n  color:#3A2B24;\r\n}\r\n\r\n\/* HERO *\/\r\n\r\n.sommen-hero{\r\n  max-width:900px;\r\n  margin-bottom:3rem;\r\n}\r\n\r\n.sommen-label{\r\n  display:inline-block;\r\n  padding:12px 20px;\r\n  border-radius:999px;\r\n\r\n  background:rgba(255,255,255,0.72);\r\n\r\n  border:1px solid rgba(255,255,255,0.95);\r\n\r\n  color:#8B6B55;\r\n\r\n  font-weight:900;\r\n\r\n  margin-bottom:1.2rem;\r\n}\r\n\r\n.sommen-hero h1{\r\n  font-size:clamp(44px,6vw,72px);\r\n  line-height:1;\r\n  margin:0 0 1.2rem;\r\n  color:#3A2B24;\r\n}\r\n\r\n.sommen-hero p{\r\n  font-size:20px;\r\n  line-height:1.9;\r\n  color:#7A6455;\r\n  font-weight:650;\r\n}\r\n\r\n\/* WERKBLAD *\/\r\n\r\n.werkblad{\r\n  background:rgba(255,255,255,0.58);\r\n\r\n  border-radius:38px;\r\n\r\n  padding:3rem;\r\n\r\n  border:1px solid rgba(255,255,255,0.96);\r\n\r\n  backdrop-filter:blur(16px);\r\n\r\n  box-shadow:0 16px 42px rgba(90,70,55,0.08);\r\n\r\n  max-width:1200px;\r\n}\r\n\r\n\/* TITEL *\/\r\n\r\n.werkblad-top{\r\n  margin-bottom:2rem;\r\n}\r\n\r\n.werkblad-top h2{\r\n  font-size:2.4rem;\r\n  margin:0 0 .7rem;\r\n  color:#3A2B24;\r\n}\r\n\r\n.werkblad-top p{\r\n  margin:0;\r\n  font-size:18px;\r\n  line-height:1.7;\r\n  color:#7A6455;\r\n  font-weight:650;\r\n}\r\n\r\n\/* SOMMEN GRID *\/\r\n\r\n.sommen-grid{\r\n  display:grid;\r\n  grid-template-columns:repeat(4,1fr);\r\n  gap:1.3rem;\r\n\r\n  margin-top:2.5rem;\r\n}\r\n\r\n\/* SOM *\/\r\n\r\n.som{\r\n  background:#FFF7EF;\r\n\r\n  border-radius:24px;\r\n\r\n  padding:1.4rem;\r\n\r\n  display:flex;\r\n  align-items:center;\r\n  justify-content:center;\r\n  gap:.8rem;\r\n\r\n  min-height:84px;\r\n\r\n  box-shadow:0 8px 20px rgba(90,70,55,0.05);\r\n}\r\n\r\n.som span{\r\n  font-size:2rem;\r\n  font-weight:900;\r\n  color:#3A2B24;\r\n}\r\n\r\n\/* INPUT *\/\r\n\r\n.som input{\r\n  width:80px;\r\n  height:54px;\r\n\r\n  border-radius:16px;\r\n\r\n  border:none;\r\n\r\n  background:white;\r\n\r\n  text-align:center;\r\n\r\n  font-size:1.5rem;\r\n  font-weight:900;\r\n\r\n  color:#3A2B24;\r\n\r\n  outline:none;\r\n\r\n  box-shadow:inset 0 0 0 2px rgba(255,228,196,0.6);\r\n}\r\n\r\n.som input:focus{\r\n  box-shadow:\r\n    0 0 0 4px rgba(255,214,168,0.45);\r\n}\r\n\r\n\/* BUTTON *\/\r\n\r\n.check-wrap{\r\n  margin-top:3rem;\r\n  text-align:center;\r\n}\r\n\r\n.check-btn{\r\n  padding:1.2rem 2.8rem;\r\n\r\n  border:none;\r\n\r\n  border-radius:999px;\r\n\r\n  background:#FFD6A8;\r\n\r\n  color:#3A2B24;\r\n\r\n  font-size:1.1rem;\r\n  font-weight:900;\r\n\r\n  cursor:pointer;\r\n\r\n  transition:.25s ease;\r\n\r\n  box-shadow:0 12px 24px rgba(255,214,168,0.35);\r\n}\r\n\r\n.check-btn:hover{\r\n  transform:translateY(-3px);\r\n  background:#FFE4C8;\r\n}\r\n\r\n\/* FEEDBACK *\/\r\n\r\n.feedback{\r\n  margin-top:2rem;\r\n\r\n  padding:2rem;\r\n\r\n  border-radius:28px;\r\n\r\n  background:rgba(255,255,255,0.72);\r\n\r\n  border:1px solid rgba(255,255,255,0.95);\r\n\r\n  display:none;\r\n}\r\n\r\n.feedback h3{\r\n  margin-top:0;\r\n  font-size:1.8rem;\r\n  color:#3A2B24;\r\n}\r\n\r\n.feedback p{\r\n  font-size:18px;\r\n  line-height:1.8;\r\n  color:#7A6455;\r\n  font-weight:650;\r\n}\r\n\r\n\/* KLEUREN GOED\/FOUT *\/\r\n\r\n.goed{\r\n  background:#E7F7E8 !important;\r\n}\r\n\r\n.fout{\r\n  background:#FFE8E8 !important;\r\n}\r\n\r\n\/* MOBIEL *\/\r\n\r\n@media(max-width:900px){\r\n\r\n  .sommen-grid{\r\n    grid-template-columns:1fr;\r\n  }\r\n\r\n  .werkblad{\r\n    padding:2rem;\r\n  }\r\n\r\n  .som{\r\n    justify-content:space-between;\r\n  }\r\n\r\n}\r\n<\/style>\r\n\r\n<section class=\"sommen-page\">\r\n\r\n  <div class=\"sommen-hero\">\r\n\r\n    <div class=\"sommen-label\">\r\n      \u2795 Sommen oefenen\r\n    <\/div>\r\n\r\n    <h1>Plus sommen tot 5.<\/h1>\r\n\r\n    <p>\r\n      Reken rustig.<br>\r\n      Je hoeft niet snel te zijn.<br>\r\n      Stap voor stap is goed genoeg.\r\n    <\/p>\r\n\r\n  <\/div>\r\n\r\n  <div class=\"werkblad\">\r\n\r\n    <div class=\"werkblad-top\">\r\n\r\n      <h2>\u2795 Nu zelf oefenen<\/h2>\r\n\r\n      <p>\r\n        Vul rustig de antwoorden in.<br>\r\n        Daarna kijken we samen na.\r\n      <\/p>\r\n\r\n    <\/div>\r\n\r\n    <div class=\"sommen-grid\" id=\"sommenGrid\"><\/div>\r\n\r\n    <div class=\"check-wrap\">\r\n\r\n      <button class=\"check-btn\" onclick=\"controleerSommen()\">\r\n        Klaar, nakijken \ud83c\udf3f\r\n      <\/button>\r\n\r\n    <\/div>\r\n\r\n    <div class=\"feedback\" id=\"feedbackBox\">\r\n\r\n      <h3 id=\"scoreTekst\"><\/h3>\r\n\r\n      <p id=\"feedbackTekst\"><\/p>\r\n\r\n    <\/div>\r\n\r\n  <\/div>\r\n\r\n<\/section>\r\n\r\n<script>\r\n\r\nconst sommen = [\r\n\r\n{a:1,b:1,antwoord:2},\r\n{a:2,b:1,antwoord:3},\r\n{a:1,b:2,antwoord:3},\r\n{a:2,b:2,antwoord:4},\r\n\r\n{a:3,b:1,antwoord:4},\r\n{a:1,b:3,antwoord:4},\r\n{a:4,b:1,antwoord:5},\r\n{a:2,b:3,antwoord:5},\r\n\r\n{a:3,b:2,antwoord:5},\r\n{a:0,b:4,antwoord:4},\r\n{a:4,b:0,antwoord:4},\r\n{a:5,b:0,antwoord:5},\r\n\r\n{a:0,b:5,antwoord:5},\r\n{a:2,b:1,antwoord:3},\r\n{a:1,b:4,antwoord:5},\r\n{a:3,b:0,antwoord:3},\r\n\r\n{a:0,b:3,antwoord:3},\r\n{a:2,b:0,antwoord:2},\r\n{a:1,b:0,antwoord:1},\r\n{a:0,b:1,antwoord:1}\r\n\r\n];\r\n\r\nconst grid = document.getElementById('sommenGrid');\r\n\r\nsommen.forEach((som,index)=>{\r\n\r\n  grid.innerHTML += `\r\n\r\n    <div class=\"som\">\r\n\r\n      <span>${som.a}<\/span>\r\n\r\n      <span>+<\/span>\r\n\r\n      <span>${som.b}<\/span>\r\n\r\n      <span>=<\/span>\r\n\r\n      <input\r\n        type=\"number\"\r\n        id=\"antwoord-${index}\"\r\n      >\r\n\r\n    <\/div>\r\n\r\n  `;\r\n\r\n});\r\n\r\nfunction controleerSommen(){\r\n\r\n  let goed = 0;\r\n\r\n  sommen.forEach((som,index)=>{\r\n\r\n    const input =\r\n      document.getElementById(`antwoord-${index}`);\r\n\r\n    const waarde =\r\n      Number(input.value);\r\n\r\n    input.classList.remove('goed');\r\n    input.classList.remove('fout');\r\n\r\n    if(waarde === som.antwoord){\r\n\r\n      goed++;\r\n\r\n      input.classList.add('goed');\r\n\r\n    }else{\r\n\r\n      input.classList.add('fout');\r\n\r\n    }\r\n\r\n  });\r\n\r\n  const feedbackBox =\r\n    document.getElementById('feedbackBox');\r\n\r\n  const scoreTekst =\r\n    document.getElementById('scoreTekst');\r\n\r\n  const feedbackTekst =\r\n    document.getElementById('feedbackTekst');\r\n\r\n  feedbackBox.style.display = 'block';\r\n\r\n  scoreTekst.textContent =\r\n    `Je hebt ${goed} van de ${sommen.length} sommen goed \ud83c\udf38`;\r\n\r\n  if(goed === sommen.length){\r\n\r\n    feedbackTekst.textContent =\r\n      'Wat fijn gedaan \ud83c\udf3f Je hebt rustig gewerkt en alles goed opgelost.';\r\n\r\n  }else if(goed >= 14){\r\n\r\n    feedbackTekst.textContent =\r\n      'Heel goed geoefend \ud83c\udf38 Je bent duidelijk aan het groeien. Fouten maken hoort bij leren.';\r\n\r\n  }else{\r\n\r\n    feedbackTekst.textContent =\r\n      'Je bent aan het leren \ud83c\udf31 Neem rustig de tijd. Fouten maken hoort erbij en helpt je brein groeien.';\r\n\r\n  }\r\n\r\n}\r\n\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\u2795 Sommen oefenen Plus sommen tot 5. Reken rustig. Je hoeft niet snel te zijn. Stap voor stap is goed genoeg. \u2795 Nu zelf oefenen Vul rustig de antwoorden in. Daarna kijken we samen na. Klaar, nakijken \ud83c\udf3f<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[6],"tags":[],"class_list":["post-2197","post","type-post","status-publish","format-standard","hentry","category-oefenen-met-sommen"],"_links":{"self":[{"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/posts\/2197","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2197"}],"version-history":[{"count":5,"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/posts\/2197\/revisions"}],"predecessor-version":[{"id":2220,"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=\/wp\/v2\/posts\/2197\/revisions\/2220"}],"wp:attachment":[{"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2197"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=2197"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/withifi.muhubonurture.nl\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=2197"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}