{"id":54880,"date":"2022-02-12T03:01:29","date_gmt":"2022-02-11T17:01:29","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/ITblog\/?p=54880"},"modified":"2022-02-12T07:46:34","modified_gmt":"2022-02-11T21:46:34","slug":"start-word-suggestions-for-wordle-iframe-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/start-word-suggestions-for-wordle-iframe-tutorial\/","title":{"rendered":"Start Word Suggestions for Wordle Iframe Tutorial"},"content":{"rendered":"
\"Start<\/a>

Start Word Suggestions for Wordle Iframe Tutorial<\/p><\/div>\n

Yesterday’s Start Word Suggestions for Wordle Styling and Scripting Tutorial<\/a>‘s presentation used a hashtag navigation link, “or below<\/a>“, to take the user to an HTML iframe hosted execution of our current web application of interest. Sometimes in such a scenario, you might be dealing with a vastly reduced width and\/or height to work with, and find your presentation to this iframe appears a bit too wide or too high. And so, today, we outline an idea or two about how to handle that.<\/p>\n

    \n
  1. decide on a strategy for “iframe” modus operandi CSS styling improvement or HTML design improvement or Javascript DOM dynamic styling improvement … we’ve decided, today …<\/li>\n
  2. for “iframe” modus operandi we want to reduce width by turning the “h1” element into an “h2” element … which amounts to an HTML design improvement<\/i> implemented via a Javascript DOM action conduit, as per …<\/li>\n
  3. decide on an intervention point for that Javascript DOM action conduit<\/i> … you guessed it … document.body onload event as the webpage loads<\/font> …
    \n<?php
    \n
    \necho \"<html>\" . $hsc . \"<body onload=onl();<\/font>><h1><span>Start five letter word for <a target=_blank href='\/\/www.powerlanguage.co.uk\/wordle\/'>Wordle<\/a> ... <\/span><input onclick=mixitup(); title='Allow for Unique Letters, Weirdness Sorting' type=button style=display:inline-block; value='via '><\/input><\/span><form id=myform style=display:inline-block; action=.\/start_word_for_wordle_helper.php method=POST><input id=mysub type=submit value=Submit style=display:none;><\/input><select style=display:inline-block; id=sugnum name=sugnum onchange=document.getElementById('mysub').click();><option id=defopt value=-\" . $sugnum . \">\" . $sugnum . \"<\/option><option value=1>1<\/option><option value=2>2<\/option><option value=3>3<\/option><option value=4>4<\/option><option value=5>5<\/option><option value=6>6<\/option><option value=7>7<\/option><option value=8>8<\/option><option value=9>9<\/option><option value=10>10<\/option><option value=20>20<\/option><option value=25>25<\/option><option value=50>50<\/option><option value=100>100<\/option><\/select><span> suggestions ...<\/span><\/h1><h3>RJM Programming ... February, 2022<\/h3><h4>Suggestions below (bigger associated number, the weirder is the suggestion) ...<\/h4><br>\" . $tablebit . \"<\/body><\/html>\";
    \n<\/code>
    \n?>
    \n … then …<\/li>\n
  4. write the new Javascript document.body onload event logic …
    \n<?php echo ”
    \n
    \n function onl() {
    \n if (window.self !== window.top) {
    \n document.body.innerHTML = ('' + document.body.innerHTML).replace(\/h1\/g, 'h2');
    \n }
    \n }
    \n<\/code>
    \n“; ?>
    \n … a total “document.body.innerHTML” (content) solution working here (but is not always a good solution) to change the “type” of an element\n<\/li>\n<\/ol>\n

    … representing a “hosting mode of use” style variation with our changed<\/a> start_word_for_wordle_helper.php<\/a> live run<\/a> link, or below<\/a>, web application!<\/p>\n

    \n

    \n

    Previous relevant Start Word Suggestions for Wordle Styling and Scripting Tutorial<\/a> is shown below.<\/p>\n

    \"Start<\/a>

    Start Word Suggestions for Wordle Styling and Scripting Tutorial<\/p><\/div>\n

    Yesterday’s Start Word Suggestions for Wordle Primer Tutorial<\/a> proof of concept “Start Five Letter Word for Wordle<\/a> Suggester” web application managed to create a workable webpage that did not need a “head”<\/a> element. What are you missing with no “head” element? Primarily …<\/p>\n