Adjusting text styles in text input box


#1

Can anyone help me to get text alignment and style right in this example. I want Arial 18pt centred in a single line input box. I have already got some JS turning off the autocorrect options etc. I also want the Text 1 ‘Correct you are right’ box to display in Arial 18pt.Quiz.hype.zip (546.1 KB)


#2

It looks like you’re almost there. To get the input form to only be a single line, add rows="1" to the text area tag, so it would look like this:

<textarea rows="1" id="myTextarea" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" style="font-size:18px;text-align:center;padding-top:10px;font-family:Arial;"></textarea>

I also added font-family:Arial, sans-serif; to that code to set the font. Here’s info on the textarea tag: http://www.w3schools.com/tags/tag_textarea.asp

To set the message box font-size, you can simply adjust the font size in the Text Inspector since it is a standard Hype element.


#3

Thanks as always for your prompt and helpful reply. Supplementary question, at the moment clicking ‘check’ runs the JS and move the quiz on. Would it be simple to get the user to hit ‘return’ on the iPad to create the same effect as clicking the check button? I have noticed that kids click ‘return’ and expect it to have the check function. At the moment it doesn’t…


#4

It looks like this person is having the same issue: http://stackoverflow.com/questions/12048796/html-form-execute-script-when-pressing-enter-without-submitting

You can execute a script after hitting the ‘return’ key using the code in that answer.