金のフレーズ・銀のフレーズ。つくったものChrome拡張Chrome拡張をつくってみました。拡張機能のボタンをクリックすると時間の計測が始まるというシンプルなタイマー機能です。まとめファイル構成ファイル構成はmanifest.jsonpopup.htmlscript.js画像フォルダとなっています。Chrome拡張のボタンをクリックしたときにポップアップされるhtmlファイル。今回はタイマーそのものです。popup.htmlから読み込んでいるjsファイル。タイマーのスクリプトを書いています。この拡張機能のアイコンを入れています。各ファイルの中身こちらの拡張機能で使っている、manisest.json・popup.html・script.js3つのファイルの中身を説明していきます。manifest.jsonこの拡張機能の情報や設定を指示するファイルです。"経過時間を計測するシンプルなタイマーです。ここでChrome拡張のアイコンをクリックしたときに表示されるポップアップをしていしています。00</div></body></html>このhtmlは、タイマーの表示領域があり、script.jsを読み込むだけとなっています。byo00;timerCount();}timerCount();こちらで何をやっているかについては割愛させていただきます。Chrome拡張をためすつくった拡張機能の動作の確認も簡単です。chromeをひらき「chrome://extensions」にアクセス。デベロッパーモードを有効にします。「パッケージ化されていない拡張機能を読み込む」をクリックして読み込むだけです。よければ先ほどのmanifest.jsonpopup.htmlscript.jsをコピーしていただき、適当なアイコンファイルを作って確認してみてもらえればと思います。まとめ今回は、アイコンをクリックしたら表示されるpopupだけで表現できるChrome拡張を作ってみました。次回は、開いているタブのhtmlを操作するChrome拡張をつくってみたいですねえ。投稿一覧TOEIC900越えを目指して英語勉強中。現在TOEIC655点。2019.04.061画面分ずつスクロールするコンテンツを作りました。jQuery使用せず、javascriptとcssで作りました。2019.03.21最近メディアサイトなどでよく見かけて、ユーザービリティ的にいいなあと思ったのでつくってみました。デモをご確認ください。2020.05.06こんにちは。最近はjavascriptを書いているときが一番楽しいホンダです。僕もいくつかのプログラミング言語に挑戦しようとしてきました。金のフレーズ・銀のフレーズ。WordPress.。