Monaca/Helloworld
提供: 初心者エンジニアの簡易メモ
初回ログインすると既に以下のようなHelloworldが設置してある。
なければこちらから。 https://docs.monaca.io/ja/sampleapp/samples/hello_world/
プロジェクトを選択し"クラウドIDE"で開くボタンを選択
サンプル
www/index.html
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta http-equiv="Content-Security-Policy" content="default-src * data: gap: content: https://ssl.gstatic.com; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'">
<script src="components/loader.js"></script>
<link rel="stylesheet" href="components/loader.css">
<link rel="stylesheet" href="css/style.css">
<script>
// PhoneGap event handler
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
console.log("PhoneGap is ready");
}
</script>
</head>
<body>
<h1>HelloWorld!</h1>
<a class="button--large" href="phonegap-demo.html">Start Demo</a>
</body>
</html>
phonegap-demo.html
<!DOCTYPE HTML>
<html>
<head>
<title>PhoneGap</title>
<meta name="viewport" content="width=device-width, user-scalable=no">
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<meta http-equiv="Content-Security-Policy" content="default-src * data: gap: https://ssl.gstatic.com; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'">
<script type="text/javascript" src="components/loader.js"></script>
<link rel="stylesheet" type="text/css" href="components/loader.css">
<script type="text/javascript">
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady(){
console.log("PhoneGap is ready.");
}
</script>
<link rel="stylesheet" href="phonegap-demo/master.css" type="text/css" media="screen" title="no title">
<script type="text/javascript" charset="utf-8" src="phonegap-demo/main.js"></script>
</head>
<body onload="init();" id="stage" class="theme">
<h1>Welcome to Cordova!</h1>
<h2>this file is located at phonegap-demo.html</h2>
<div id="info">
<h4>Platform: <span id="platform"> </span>, Version: <span id="version"> </span></h4>
<h4>UUID: <span id="uuid"> </span>, Name: <span id="name"> </span></h4>
<h4>Width: <span id="width"> </span>, Height: <span id="height">
</span>, Color Depth: <span id="colorDepth"></span></h4>
</div>
<a href="#" class="btn large" onclick="getLocation();">Get Location</a>
<a href="tel:411" class="btn large">Call 411</a>
<a href="#" class="btn large" onclick="vibrate();">Vibrate</a>
<a href="#" class="btn large" onclick="show_pic();">Get a Picture</a>
<a href="#" class="btn large" onclick="check_network();return false;">Check Network</a>
<div id="viewport" class="viewport" style="display: none;">
<img style="width:60px;height:60px" id="test_img" src="" />
</div>
</body>
</html>
