Text

Widget in HTML5 modal window

Hello,

We are trying to incorporate hand written recognizer in a HTML5 form in a modal window and facing issues in opening the modal window itself. The same script works well and good in desktop browsers, however it is not working in tablet browsers. Our objective is to integrate and demo in tablet browsers.

Any suggestions?

Thanks,
Kishore

=====================
Following is the sample code;
<body>
Open Modal Popup
<div id=modal class=modal fade aria-hidden=true>
<div class=modal-dialog>
<div class=modal-content style=border-radius:0;>
<div class=modal-body style=padding:0px;background:#fff;color:#a0a0a0;>
<table width=700px>
<tr>
<td align=left valign=middle></td>
<td align=right valign=middle><h1 style=color:#009AA8;>MyScript Cloud - Text Sample</h1></td>
</tr>
</table>
<canvas id=canvas style=width:700px; height: 300px; border: 1px solid black; background-color: #FFFFBF;> </canvas>

<br/>
<br/>
<p id=result style=color:#009AA8; font-size:large;></p>
</div>
</div>
</div>
</div>
<script type=application/javascript src=myScriptMethods.js></script>
<script type=application/javascript>
$(function() {
var apiKey = xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx;

$(#loading).hide();
$(#canvas).write(apiKey);
});
</script>
</body>

1 Comment

Dear Kishore,

unfortunately, it is difficult to provide with an answer as is, as this all depends on your browser, your device, the android version...

I recommend you have a look on the internet, to find few tips to make sure your code is compatible. For example:
-https://github.com/twbs/bootstrap/issues/12888
-http://designwebsiteblog.com/design/web-design/creating-a-modal-window-with-html5-css3.html
-http://tjvantoll.com/2012/05/02/showmodaldialog-what-it-is-and-why-you-should-never-use-it/

Best regards,

Olivier

Login or Signup to post a comment