初めに
前回の投稿から一年半程度空いてしまいました。主に院試や卒論といった学生の仕事のメインの方に時間を取られてしまい、なかなか記事の投稿に着手できていませんでした。
しかし、ここ数ヶ月で当掲示板やゲーム制作など、自分がプログラミングでもともと表現したかったものを作成するという目標が果たせそうなのでここにアウトプットしていきたいと思います。
imgとvideo
まず初めに作成したウェブアプリをご覧ください。
書き込みテストのスレッドに適当なスクリーンショットの画像と動画がアップロードされていると思います。
これは現在ChromeブラウザとSafariで同じように表示されているはずですが、作成当初はSafariでは表示されるがChromeでは表示されないというバグを含んでいました。
キャッシュの削除等色々試してみた結果safariではimgタグで画像も動画も扱える一方でChromeではimgタグでは画像のみで動画はvideoタグを使わないと動画を再生できないらしいことが判明しました。
私のようにMacで開発中の方は是非違うブラウザでも作成したウェブサイトを表示してみてください!
ちなみに無音での自動再生はこちらのサイトに教えていただいたところ次のように書けば実行できます。
<video src="○○.mp4″ autoplay muted></video>
Safariだとimgタグのsrcを動画にするだけで自動的にこのモードになると思います(そんな挙動でした)。
参考リンク
videoタグを使って動画を埋め込む
https://www.omakase.net/blog/2021/04/video.html