Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Firefox OSアプリ開発ハンズオン(Hello World編)

1,359 views

Published on

https://gunmaweb.doorkeeper.jp/events/21025 で使用したハンズオン資料。
Firefox OSのアプリのHello Worldから始まって、スマホに搭載されているセンサーをJavaScriptから使ってみるところまでをカバーしています。

Published in: Technology
  • Be the first to comment

Firefox OSアプリ開発ハンズオン(Hello World編)

  1. 1. 

  2. 2.
  3. 3. 
 
 

  4. 4.
  5. 5. 
 
 
 

  6. 6.
  7. 7. <body> <h1>こんにちは!せかい!</h1> </body>
  8. 8.
  9. 9. <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,user- scalable=no,initial-scale=1"> <title>Hello World</title> <link rel="stylesheet" href="app.css"> <script src="app.js" defer></script> </head>
  10. 10. body{ font-size: 18px; overflow: hidden; background-color: #00539F; } h1{ font-size: 640%; line-height: .8; color: white; }
  11. 11. var indicator; var displayBrightness = function(element, value){ element.textContent = value; }; var handleDeviceLightEvent = function(event){ var lux = event.value; if(indicator != null){ displayBrightness(indicator, lux); } }; window.addEventListener("devicelight", handleDeviceLightEvent);
  12. 12. var initApp = function(){ indicator = document.querySelector("h1"); }; window.addEventListener("load", initApp);
  13. 13. var indicator; var displayBrightness = function(element, value){ element.textContent = value; }; var handleDeviceLightEvent = function(event){ var lux = event.value; if(indicator != null){ displayBrightness(indicator, lux); } }; window.addEventListener("devicelight", handleDeviceLightEvent);
  14. 14.
  15. 15. https://developer.mozilla.org/Apps
  16. 16.

×