はじめてのChrome extension
Upcoming SlideShare
Loading in...5
×

Like this? Share it with your network

Share

はじめてのChrome extension

  • 12,374 views
Uploaded on

初心者向けのChrome Extensionの資料です。

初心者向けのChrome Extensionの資料です。

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
12,374
On Slideshare
9,780
From Embeds
2,594
Number of Embeds
10

Actions

Shares
Downloads
52
Comments
0
Likes
26

Embeds 2,594

http://d.hatena.ne.jp 1,949
http://wiki.onakasuita.org 397
http://fumit.blogspot.com 165
http://fumit.blogspot.jp 52
https://twitter.com 12
http://nuevospowerpoints.blogspot.com 5
http://webcache.googleusercontent.com 5
http://fumit.blogspot.co.uk 3
http://translate.googleusercontent.com 3
http://us-w1.rockmelt.com 3

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. 2011/10/29 BootCamp 2011Toru Yoshikawa ( @yoshikawa_t ) #bc2011jp #chr1
  • 2. { "name": "Sample Extension", "version": "0.1", "browser_action": { "default_popup": "popup.html", "default_icon": "icon.png" }}
  • 3. <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <style> p { font-size: 32px; } </style> </head> <body> <p>Hello, World!</p> </body></html>
  • 4. { "name": "Sample Extension", "version": "0.2", "browser_action": { "default_popup": "popup.html", "default_icon": "icon.png" }, "background_page": "background.html", "permissions": [ "notifications" ]}
  • 5. <!-- HTML --><script> function setTimer(millisecond) { setTimeout(notify, millisecond); } function notify(){ var popup = webkitNotifications.createNotification(icon.png, , Hello, World!); popup.show(); }</script>
  • 6. <!-- HTML --> :<input type="number" value="3" min="1" step="1" id="second"><input type="button" value=" " id="start"><script> var second = document.getElementById(second).value | 0, button = document.getElementById(start); button.addEventListener(click, function(){ // Background Page Window var bg = chrome.extension.getBackgroundPage(); bg.setTimer(second * 1000); }, false);</script>
  • 7. { /* */ "content_scripts": [ { "matches": ["http://*/*", "https://*/*"], "js": ["content_script.js"], "run_at": "document_end" } ]}
  • 8. var div = document.createElement(div);div.textContent = Hello, World!;div.style.cssText = position: absolute; top: 0; left:0; font-size: 32px; color: red;;document.body.appendChild(div);