0
198
ViewsHow to solve codemirror problem for mobile devices?
I downloaded code mirror from official website and tried to test it on mobile device. At first I linked all the core files as described in the docs. Inside the index.html I added the following code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<!-- link codemirror -->
<script src="lib/codemirror.js"></script>
<link rel="stylesheet" href="lib/codemirror.css">
<link rel="stylesheet" href="theme/duotone-dark.css" type="text/css" media="all" />
<script src="mode/javascript/javascript.js"></script>
</head>
<body>
<script type="text/javascript" charset="utf-8">
var myCodeMirror = CodeMirror(document.body,
{
mode: "javascript",
value: "var a = 'DS code is cool thanks to codemirror';",
lineNumbers: true,
lineWrapping: true
}
);
</script>
</body>
</html>
When I tried to preview it, It looks it's working properly but it's not.
When I add a new line and try to backpress,
i. it hide soft keyboard and Backpress doesn't work when removing new line(see figure 1).
When I type var and press enter,
ii. it misbehave(see figure 2. It is not working sometimes when I click the editor to edit).
iii. It is also not taking the full height of screen.
Figure 1
Figure 2
How to solve them? Thanks in advance. My main purpose is to add it inside android webview.
·
Juan Pablo Isaza
Answer question