完成したツール: YouTube字幕合成ツール GitHubのリポジトリ: GitHub - kalaxity/youtube_caption_app 1. 目的 字幕として表示したい文章と画像を入力すると、字幕付き画像が出力されるようなプログラムを作成したい。 ただ単に画像の上に字幕を表示するのは…

もともと別の記事に書いていた内容だが、読みづらいと感じたため分割。 1. 画像の読み込み まず画像を読み込む方法について学んだ。 HTMLに <input type="file" id="input_image" accept="image/*"> を設置することで、ファイル選択ボタンが表示される(ここではaccept="image/*"と設定しているため、画像のみ選択で…

Webアプリと呼んでいいのかという出来だが... 1. 作成に至る経緯 平均情報量を計算する際に、底が2のlogを何度も計算することになった。 底が10(常用対数)やe(自然対数)であれば、たいていの計算アプリを用いて簡単に計算できる。 しかし底2の対数を(一発で)…

1. 背景 JavaScriptを用いた画像処理に興味があったので、まず簡単なプログラムを作成してみることにした。 2. 目的 画像を縦にm分割、横にn分割し、分割した画像を表示するプログラムを作成する。 3. プログラムの処理内容 (ユーザ側) ユーザが画像を入力す…

2024-03-06追記 uBlockOriginで色を変える方法がわかったので別の記事に書いた。 everykalax.hateblo.jp デフォルトではクリック済のリンクの色が見づらい場合があるので変えたい。 リンクの色をCSSで指定する クリック済のリンクのスタイルについては、CSS…

(結論だけ見たい方は4. 作成の節をご覧ください) 0. はじめに リンク先に飛んだ際、そのページが閉鎖していたり、「お探しのページは見つかりませんでした」と言われることがある。 そうした際にインターネットアーカイブは便利である。 今回は、現在閲覧し…

(結論だけ見たい方は6節を見てください) 1. はじめに ページのタイトル(htmlのtitleタグに指定されているもの)をコピーする機会が結構ある。 しかし毎回ソースコードから持ってくるのは面倒である。 そのため、タイトルをコピーするブックマークレットを作成…

アイカツ!の一挙放送を見ながらAtCoder(ABC222)をする必要が生じたため。 記事の要約 このブックマークレットを実行するとPIPできるようになる(ブックマークレットの実行についてはこちらなどを参照)。 javascript:(function(){document.getElementsByClassN…

↓ここに表示されるはず const useragent = window.navigator.userAgent; const displayArea = document.getElementById("display"); displayArea.innerText = useragent; それだけ。 書いたコード はてなブログをMarkdown方式で編集している方は、以下のコー…

注意 以下の内容は2021/09/19時点での仕様に基づいて書かれたものである。GFの仕様変更により、いつか使えなくなるかもしれない。 概要 ガールフレンド(仮)というゲームには聖櫻学園劇場というコンテンツがある。 ここでは各キャラクターごとのストーリーを…

概要 Qiitaには、古い記事の先頭に注意文が表示される機能がある。 図1. Qiitaで古い記事に表示される注意文の例 これを自分のブログにも搭載したい。 方法 以下の記事を参考にして作った。 sprint-life.hatenablog.com プログラム自体はこの記事のおかげで…

忘れないうちにメモ。 目的 twitterのいいね数を非表示にしたい 思いついた方法 document.querySelectorAllで複数ツイートのいいね数の表示領域を指定し、得たNodeList内の各要素を非表示にする。 詳細 document.querySelectorAllについては過去に触れたこと…

spotifyのプレイリスト内の楽曲のタイトルをまとめて取得したい。 丁度いい機会なので、クエリセレクタを用いて取得してみようと思う。 目次 セレクタの作成 セレクタで要素を取得する Nodelistの処理 取得したタイトルを整形して表示する まとめ 感想 セレ…