66」が公開されました。PC用(Windows、Mac、Linux)です。この最新版に実装された機能に「音声付き動画の自動再生無効化」というものがあります。広告動画からの音声を制限するのが主たる目的だそうです。WEBページを開くと、いきなり動画の音声が大音響で流れるのはウザいですからね。以下のサンプルページですが、*サンプル:自動再生:Youtube埋め込み動画ページを開くと、Youtube動画が自動再生される設定にしてあります。このページをFirefox・Edge・IEなどで開くと普通に自動再生されます。Chrome66で開くと自動再生されません。ところが、この機能追加により、一部のHTML5の背景動画実装サイトにて、無音の動画であってもChrome66にて自動再生できない事象が起きています。今回はこれの対処法について。「muted」属性を加えるこの事象の解決策ですが、結論から言うとvideoタグに「muted」属性を加えれば動画は普通に再生されます。「muted」属性とは、動画を無音で再生させる属性です。例として以下のようなコードになります。src="movie.mp4"></video>*「autoplay」属性:動画を自動再生させる*「loop」属性:繰り返し再生させる*「muted」属性:無音で再生させる元々が無音の動画であっても、あえて「muted」属性を加えないと、Chrome66では自動再生されません。試しに以下のサンプルページを作ってみました。*サンプル:背景動画のWEBページ上の動画は「muted」属性有り、下が無しです。両方とも動画ファイル自体は無音声です。Firefox・Edge・IEでの挙動と、Chrome66での挙動を比較してみてください。有名な背景動画サイトの場合は有名な背景動画サイトであっても、「muted」属性有りのサイトと、無しのサイトがあります。(2018年5月8日現在)「muted」属性有りhttp://www.theqcamera.com/https://ureshinochadoki.shop/「muted」属性無しhttp://www.tokyobase.co.jp/http://www.letsgo-ogasawara.com/上の2サイトはChrome66にて自動再生OK、下2つは自動再生できません。新・WordPressテーマ「Lightning」でサイト制作:まとめページWordPressテーマ「BusinessPress」でWEBサイトを制作:まとめページ便利なWordPressプラグイン:まとめページ無料画像編集ソフト「PhotoScape」使用方法:まとめページランサーズ受注ノウハウ:まとめページブログ主プロフケンです。後半開始⇒帰郷して職業訓練⇒2人会社勤務⇒フリーランスとなる。◇Twitterは更新通知+小ネタ用です。