{"id":48387,"date":"2020-03-27T03:01:56","date_gmt":"2020-03-26T17:01:56","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/ITblog\/?p=48387"},"modified":"2020-03-27T05:27:01","modified_gmt":"2020-03-26T19:27:01","slug":"horizontal-rule-and-div-ios-desktop-issues-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/horizontal-rule-and-div-ios-desktop-issues-tutorial\/","title":{"rendered":"Horizontal Rule and Div iOS Desktop Issues Tutorial"},"content":{"rendered":"
\"Horizontal<\/a>

Horizontal Rule and Div iOS Desktop Issues Tutorial<\/p><\/div>\n

Add the reading of the blog posting thread that Media iOS Image Capture Ajax FormData Cache Tutorial<\/a> lies in to the recent Horizontal Rule and Div Glowing Lines and Vertices Tutorial<\/a> and you get to the gist of the work today fixing issues we had getting to proper iPad desktop icon to Safari web browser (alas, the “lock in”, as you can read more about later) behaviour for our square_hr_tracing.htm HR Tracing and More web application suite of functionalities.<\/p>\n

You may recall with this project big use of location.hash<\/i> (ie. web browser address bar hashtagging via #[hashtag] syntax). Revisiting those iPad desktop icons we’d created some time ago we discovered that the …<\/p>\n


\nhttps:\/\/www.rjmprogramming.com.au\/HTMLCSS\/square_hr_tracing.htm?wording=Hangman%20Game&question=%20#hangman%23hangman%23hangman<\/a>
\n<\/code><\/p>\n

… iPad (ie. iOS) desktop icon execution path property was meant to match with an “Image Reveal Game” intention, but brought up a hybrid of “Image Reveal Game” and “Maths Grid Paper” functionality. It’s been a while, but luckily not too long gone, and we remembered that we had multiple location.hash<\/i> scenarios as part of the compartmentalization of functionality. Yet, looking at that URL above, we realized wherever we saw what used to be (code snippets like) …<\/p>\n


\n if ((' ' + location.hash).split('#').length > 3 || (' ' + location.hash).indexOf('hangman-00.0') != -1) {
\n \/\/ logic here
\n }
\n<\/code><\/p>\n

… present, we would fix a lot of our issues<\/font> by using, instead (code snippets like) …<\/p>\n


\n if ((' ' + location.hash).split('#').length > 3 || (' ' + location.hash).split('hangman').length > 3<\/font> || (' ' + location.hash).indexOf('hangman-00.0') != -1) {
\n \/\/ logic here
\n }
\n<\/code><\/p>\n

… to cater for the “encodeURIComponent(‘#’) equals ‘%23’<\/i>” (or “decodeURIComponent(‘%23’) equals ‘#’<\/i>“) derived unexpected iOS desktop scenario we found above.<\/p>\n

And then we came to testing the iPad (ie. iOS) desktop “Maths Grid Paper” icon functionality (again via an iPad (iOS) desktop icon touch). We now got to the correct “look” of functionality, but that functionality was non-functional, in that scribbling wasn’t happening. And here, we tried to change our own code for quite some time before a break, and some thinking and note taking …<\/p>\n

<\/img><\/p>\n

… “ignoring the bins”<\/font> … got us to question Safari iPad web browser here, when finding, with idea 1) above, that on Chrome iPad web browser, the equivalent …<\/p>\n


\nhttps:\/\/www.rjmprogramming.com.au\/HTMLCSS\/square_hr_tracing.htm?wording=Hangman%20Game&question=%20#hangman%23hangman<\/a>
\n<\/code><\/p>\n

… “Maths Grid Paper” functionality did work properly. So this got us to do what we wish we’d done a lot earlier, via a Google search of safari iPad ontouchmove issue<\/a> regarding our iPad (iOS) Safari (version 13.3.3). Lo and behold, there are issues and we found the advice on Safari browser is seriously messed up after 13.1.2 Update<\/a> …<\/p>\n

\nFollowing update to iPadOS13, your Safari browser now defaults to render the full \u201cDesktop\u201d version of sites – instead of the reduced \u201cmobile\u201d version.
\n
\nIf the website is having difficulty rendering content with the updated iPadOS browser, then you could try using the mobile version. Simply tap the aA button in the Safari search bar, then select \u201cRequest Mobile Site\u201d. The website may otherwise require update to be fully compatible, in which case you\u2019ll need to contact the webmaster of the affected site(s).\n<\/p><\/blockquote>\n

… and we started getting iPad (iOS) Safari 13.3.3 web browser working with our scribble functionality needed in our “Maths Grid Paper” functionality when …<\/p>\n