{"id":15741,"date":"2015-07-03T05:01:23","date_gmt":"2015-07-02T19:01:23","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/ITblog\/?p=15741"},"modified":"2015-07-02T22:31:18","modified_gmt":"2015-07-02T12:31:18","slug":"htmljavascript-scrabbling-snakes-game-primer-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/htmljavascript-scrabbling-snakes-game-primer-tutorial\/","title":{"rendered":"HTML\/Javascript Scrabbling Snakes Game Primer Tutorial"},"content":{"rendered":"<div style=\"width: 230px\" class=\"wp-caption alignnone\"><a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/word_jumble.html\"><img decoding=\"async\" style=\"border: 15px solid pink;\" alt=\"HTML\/Javascript Scrabbling Snakes Game Primer Tutorial\" src=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/word_jumble.jpg\" title=\"HTML\/Javascript Scrabbling Snakes Game Primer Tutorial\"  style=\"float:left;\"  \/><\/a><p class=\"wp-caption-text\">HTML\/Javascript Scrabbling Snakes Game Primer Tutorial<\/p><\/div>\n<p>Scrabbling Snakes is a hybrid game combining the <a target=_blank title='Scrabble home page' href='http:\/\/www.hasbro.com\/scrabble\/en_US\/'>Scrabble<\/a> board with styling to look a bit like snakes (well, you had to be there) and with a word scramble game feel.  It could do well as a vocabulary improvement game for an <a target=_blank title='ESL information from Wikipedia ... thanks' href='https:\/\/en.wikipedia.org\/wiki\/English_as_a_second_or_foreign_language'>ESL<\/a> student, as the dictionary used is in English, using the web server&#8217;s wordlist arrangements.<\/p>\n<p>Am sure if you are interested how we created this game you would not have too much trouble seeing what we did by examining the HTML and Javascript code you could call <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/word_jumble.html_GETME\" title='word_jumble.html'>word_jumble.html<\/a> (which supervises PHP <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/word_jumble.php_GETME\" title='word_jumble.php'>word_jumble.php<\/a> to validate the words).<\/p>\n<p>Scrabbling Snakes consists of a grid (ours is 15&#215;15 like Scrabble uses) of letters (from a to z) not repeated horizontally nor vertically within that grid, if that is possible.<\/p>\n<p>The grid tiles show the letters with a <a target=_blank title='HTML sup tag information from w3schools' href='http:\/\/www.w3schools.com\/tags\/tag_sub.asp'>sub<\/a> tag showing the letter score value, and we have Scrabble background tile colours as in &#8230;<\/p>\n<ul>\n<li><font color=red>Red<\/font> triple word score<\/li>\n<li><font color=pink>Pink<\/font> double word score<\/li>\n<li><font color=blue>Blue<\/font> triple letter score<\/li>\n<li><font color=lightblue>Light blue<\/font> double letter score<\/li>\n<\/ul>\n<p> &#8230; and the tile text colour is <font color=black>Black<\/font> before (double) clicking, before turning <font color=orange>Orange<\/font> on a successfully registered (double) click.<\/p>\n<p>So words can be three or more characters &#8230; no plurals, no proper nouns, no apostrophies or non alpha characters.<\/p>\n<p>There is no surprise with the HTML &#8220;grid&#8221; being composed of an HTML <a target=_blank title='HTML table information from w3schools' href='http:\/\/www.w3schools.com\/html\/html_tables.asp'>table<\/a> element.<\/p>\n<p>Hope you get some HTML and Javascript ideas about games, and have fun playing this word game, today, with our <a target=_blank href=\"http:\/\/www.rjmprogramming.com.au\/HTMLCSS\/word_jumble.html\" title='click picture'>live run<\/a>.<\/p>\n<p>If this was interesting you may be interested in <a title='Click here to see topics in which you might be interested' href='#d15741' onclick='var dv=document.getElementById(\"d15741\"); dv.innerHTML = \"&lt;iframe width=670 height=600 src=\" + \"https:\/\/www.rjmprogramming.com.au\/ITblog\/?tag=word-game\" + \"&gt;&lt;\/iframe&gt;\"; dv.style.display = \"block\";'>this<\/a> too.<\/p>\n<div id='d15741' style='display: none; border-left: 2px solid green; border-top: 2px solid green;'><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Scrabbling Snakes is a hybrid game combining the Scrabble board with styling to look a bit like snakes (well, you had to be there) and with a word scramble game feel. It could do well as a vocabulary improvement game &hellip; <a href=\"https:\/\/www.rjmprogramming.com.au\/ITblog\/htmljavascript-scrabbling-snakes-game-primer-tutorial\/\">Continue reading <span class=\"meta-nav\">&rarr;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[12,15,37],"tags":[281,396,476,477,576,652,932,997,1603,1319,1453,1454],"class_list":["post-15741","post","type-post","status-publish","format-standard","hentry","category-elearning","category-games","category-tutorials","tag-css","tag-esl","tag-game","tag-games-2","tag-html","tag-javascript","tag-php","tag-programming","tag-scrabble","tag-tutorial","tag-word-game","tag-word-games"],"_links":{"self":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/15741"}],"collection":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/comments?post=15741"}],"version-history":[{"count":4,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/15741\/revisions"}],"predecessor-version":[{"id":15745,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/posts\/15741\/revisions\/15745"}],"wp:attachment":[{"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/media?parent=15741"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/categories?post=15741"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rjmprogramming.com.au\/ITblog\/wp-json\/wp\/v2\/tags?post=15741"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}