すき家とかかつやみたいな和食屋で外国人雇うな (89ﾚｽ)
上下前次1-新
抽出解除 必死ﾁｪｯｶｰ(本家) (べ) 自ID ﾚｽ栞 あぼーん
38(2): 蟻人間 ◆T6xkBnTXz7B0 2020/12/10(木)09:58 ID:a08vYCAA(1/5) AAS
>>37
一応、簡単に解説しよう。
4行目。tは時間の変数。
5行目。execute_scriptメソッドで文字列のJavascriptコードを実行する。
6行目。乱数を取得。
7行目。CSSセレクタでDOM要素を取得する。
9行目。styleがないDOM要素は無視する。
10行目。transformで回転させる。
14行目。tを使って、連番のファイル名の文字列を構築する。
15行目。スクリーンショットを取得する。
43: 蟻人間 ◆T6xkBnTXz7B0 2020/12/10(木)17:00 ID:a08vYCAA(2/5) AAS
次はハンマーで叩いてみるんだが、ハンマーは今回はアニメGIF画像で表現する。
GIF画像はアニメーションと透過ができるファイル形式である。アニメGIFを作るには複数のGIFファイルをつなげてアニメにする特殊なソフトを使用する(フリーソフトでOK)。
画像要素の追加には
document.createElement('img')
と
appendChildを使用する。画像を追加して表示すればアニメーションは自動的に開始される。
画像のソース(src)には、data: urlを使用して画像データを埋め込むことにする。
44(1): 蟻人間 ◆T6xkBnTXz7B0 2020/12/10(木)17:03 ID:a08vYCAA(3/5) AAS
画像をdata: urlに変換するツールは次の通り:
外部ﾘﾝｸ[html]:www.peko-step.com
49(1): 蟻人間 ◆T6xkBnTXz7B0 2020/12/10(木)22:00 ID:a08vYCAA(4/5) AAS
>>48
一応解説しておこう。
4行目。ideoneが勝手にＵＲＬを改変したので、ＵＲＬの修正が必要だ。
10行目。srcにdata URLを設定して画像を作成している。このデータは>>47を使って作成した。
11行目。document. getElementByIdなどでアクセスできるIDを設定している。このIDは後で使う。
12〜14行目。img要素の位置を指定している。CSSの勉強をした人なら位置の指定方法を知っているはずだ。
50: 蟻人間 ◆T6xkBnTXz7B0 2020/12/10(木)22:18 ID:a08vYCAA(5/5) AAS
ここまで。CSSを勉強した人なら、位置やサイズ、色、回転角度をピクセル単位やパーセントなどで自由に指定できるはずだ。
window. innerWidthとwindow. innerHeight
を使えばブラウザの画面サイズが得られるはずだ。
ひび割れを入れるとか、爆発させるとか、画面を暗くするとか、カーテンを下ろすなどの効果も考えられるだろう。
>>20さん、何か作ってくれませんか？
上下前次1-新書関写板覧索設栞歴
ｽﾚ情報 赤ﾚｽ抽出 画像ﾚｽ抽出 歴の未読ｽﾚ AAｻﾑﾈｲﾙ
ぬこの手 ぬこTOP 0.018s