{"id":2161,"date":"2017-08-12T04:07:05","date_gmt":"2017-08-12T04:07:05","guid":{"rendered":"http:\/\/javascript-tutor.net\/?page_id=2161"},"modified":"2018-04-08T02:23:37","modified_gmt":"2018-04-08T02:23:37","slug":"animated-digital-dice","status":"publish","type":"page","link":"https:\/\/javascript-tutor.net\/index.php\/animated-digital-dice\/","title":{"rendered":"Animated Digital Dice"},"content":{"rendered":"<p>You can create an animated digital dice easily using the setInterval() method to be used as the timer.<br \/>\nBesides, we use the floor method and the random method to generate random integers from 1 to 6 using the following syntax:<\/p>\n<p>Math.floor( 1 + Math.random() * 6 )<\/p>\n<p>The full script is as follows<\/p>\n<pre style=\"font-size: 100%;\">&lt;div style=\"border:4px solid blue; width:8%; text-align:center;padding:0\"&gt;&lt;h1 id=\"dice\" style=\"font-size:300%\"&gt;1&lt;\/h1&gt;&lt;\/div&gt;\r\n&lt;br&gt;\r\n&lt;button onclick=\"AniDice()\"&gt;Roll Dice&lt;\/button&gt;\r\n&lt;button onclick=\"stopDice()\"&gt;Stop&lt;\/button&gt;\r\n\r\n&lt;script&gt;\r\n\r\nfunction AniDice()\r\n{\r\nMyVar=setInterval(rolldice,20)\r\n}\r\n\r\nfunction rolldice()\r\n{\r\nvar ranNum = Math.floor( 1 + Math.random() * 6 );\r\ndocument.getElementById(\"dice\").innerHTML = ranNum;\r\n\r\n}\r\nfunction stopDice()\r\n{clearInterval(MyVar);}\r\n&lt;\/script&gt;\r\n<\/pre>\n<p>View <a href=\"http:\/\/javascript-tutor.net\/JSample\/ani_digital_dice.htm\">Animated Digital Dice <\/a>here.<\/p>\n<p>View <a href=\"http:\/\/javascript-tutor.net\/JSample\/animated_dice1.htm\">Animated Graphical Dice<\/a> here.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>You can create an animated digital dice easily using the setInterval() method to be used as the timer. Besides, we use the floor method and the random method to generate random integers from 1 to 6 using the following syntax: Math.floor( 1 + Math.random() * 6 ) The full script is as follows &lt;div style=&#8221;border:4px &hellip; <a href=\"https:\/\/javascript-tutor.net\/index.php\/animated-digital-dice\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Animated Digital Dice&#8221;<\/span><\/a><\/p>\n","protected":false},"author":35895,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-2161","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.1 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Animated Digital Dice - Learn JavaScript Online | Free Interactive JavaScript Tutorials<\/title>\n<meta name=\"description\" content=\"Creating an animated digital dice using JavaScript\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"http:\/\/javascript-tutor.net\/jSample\/jsp_anidice.html\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Animated Digital Dice - Learn JavaScript Online | Free Interactive JavaScript Tutorials\" \/>\n<meta property=\"og:description\" content=\"Creating an animated digital dice using JavaScript\" \/>\n<meta property=\"og:url\" content=\"http:\/\/javascript-tutor.net\/jSample\/jsp_anidice.html\" \/>\n<meta property=\"og:site_name\" content=\"Learn JavaScript Online | Free Interactive JavaScript Tutorials\" \/>\n<meta property=\"article:modified_time\" content=\"2018-04-08T02:23:37+00:00\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/javascript-tutor.net\/index.php\/animated-digital-dice\/\",\"url\":\"http:\/\/javascript-tutor.net\/jSample\/jsp_anidice.html\",\"name\":\"Animated Digital Dice - Learn JavaScript Online | Free Interactive JavaScript Tutorials\",\"isPartOf\":{\"@id\":\"https:\/\/javascript-tutor.net\/#website\"},\"datePublished\":\"2017-08-12T04:07:05+00:00\",\"dateModified\":\"2018-04-08T02:23:37+00:00\",\"description\":\"Creating an animated digital dice using JavaScript\",\"breadcrumb\":{\"@id\":\"http:\/\/javascript-tutor.net\/jSample\/jsp_anidice.html#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"http:\/\/javascript-tutor.net\/jSample\/jsp_anidice.html\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"http:\/\/javascript-tutor.net\/jSample\/jsp_anidice.html#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/javascript-tutor.net\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Animated Digital Dice\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/javascript-tutor.net\/#website\",\"url\":\"https:\/\/javascript-tutor.net\/\",\"name\":\"Learn JavaScript Online | Free Interactive JavaScript Tutorials\",\"description\":\"Master JavaScript with free, interactive tutorials for beginners and experienced coders. Practice live coding and visualize how JavaScript works step by step.\",\"inLanguage\":\"en-US\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Animated Digital Dice - Learn JavaScript Online | Free Interactive JavaScript Tutorials","description":"Creating an animated digital dice using JavaScript","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"http:\/\/javascript-tutor.net\/jSample\/jsp_anidice.html","og_locale":"en_US","og_type":"article","og_title":"Animated Digital Dice - Learn JavaScript Online | Free Interactive JavaScript Tutorials","og_description":"Creating an animated digital dice using JavaScript","og_url":"http:\/\/javascript-tutor.net\/jSample\/jsp_anidice.html","og_site_name":"Learn JavaScript Online | Free Interactive JavaScript Tutorials","article_modified_time":"2018-04-08T02:23:37+00:00","twitter_misc":{"Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/javascript-tutor.net\/index.php\/animated-digital-dice\/","url":"http:\/\/javascript-tutor.net\/jSample\/jsp_anidice.html","name":"Animated Digital Dice - Learn JavaScript Online | Free Interactive JavaScript Tutorials","isPartOf":{"@id":"https:\/\/javascript-tutor.net\/#website"},"datePublished":"2017-08-12T04:07:05+00:00","dateModified":"2018-04-08T02:23:37+00:00","description":"Creating an animated digital dice using JavaScript","breadcrumb":{"@id":"http:\/\/javascript-tutor.net\/jSample\/jsp_anidice.html#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["http:\/\/javascript-tutor.net\/jSample\/jsp_anidice.html"]}]},{"@type":"BreadcrumbList","@id":"http:\/\/javascript-tutor.net\/jSample\/jsp_anidice.html#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/javascript-tutor.net\/"},{"@type":"ListItem","position":2,"name":"Animated Digital Dice"}]},{"@type":"WebSite","@id":"https:\/\/javascript-tutor.net\/#website","url":"https:\/\/javascript-tutor.net\/","name":"Learn JavaScript Online | Free Interactive JavaScript Tutorials","description":"Master JavaScript with free, interactive tutorials for beginners and experienced coders. Practice live coding and visualize how JavaScript works step by step.","inLanguage":"en-US"}]}},"_links":{"self":[{"href":"https:\/\/javascript-tutor.net\/index.php\/wp-json\/wp\/v2\/pages\/2161","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/javascript-tutor.net\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/javascript-tutor.net\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/javascript-tutor.net\/index.php\/wp-json\/wp\/v2\/users\/35895"}],"replies":[{"embeddable":true,"href":"https:\/\/javascript-tutor.net\/index.php\/wp-json\/wp\/v2\/comments?post=2161"}],"version-history":[{"count":5,"href":"https:\/\/javascript-tutor.net\/index.php\/wp-json\/wp\/v2\/pages\/2161\/revisions"}],"predecessor-version":[{"id":2166,"href":"https:\/\/javascript-tutor.net\/index.php\/wp-json\/wp\/v2\/pages\/2161\/revisions\/2166"}],"wp:attachment":[{"href":"https:\/\/javascript-tutor.net\/index.php\/wp-json\/wp\/v2\/media?parent=2161"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}