Snow Monkey Blocks セクションの背景動画でiPhoneの低電力モードで再生ボタンがタップできない問題を回避するCSS

Snow Monkey Blocksのセクション(背景画像/動画)に、動画を配置し自動再生に設定しても、iPhoneの低電力モードだと、自動再生されず、再生ボタンをタップする必要がある。

ただ、ここで問題になるのが、セクションブロックなので、再生ボタンの上に文字が配置してケース。文字が邪魔で、再生ボタンがタップできない。

そんな場合は、上のツィートの通り、pointer-events: none; のCSSを上の文字に適応すると、問題が回避でき再生ボタンがタップできる。

実際にこのCSSを適応しているページはこちら。(私が制作してお納めしたページです)

参考にした記事はこちら。

実際に追加したCSSはこちら。

/* 省電力モード対策 */
.smb-section-with-bgimage>.c-container{
	pointer-events: none;
}

iPhone省電力モードで動画の自動再生が動かないのに対策する手法の資料はこちら。

iPhoneのモバイルバッテリーでおすすめはこちら。(WatchもOKで、しかも充電も速くできる)

  • ブックマーク

この記事が良かった!時は、ぜひ、イイネください。記事を書く励みになります。

無料メルマガ発行中

メルマガも2021年は頑張って書いています。ぜひ登録して読んでくださいね。(無料です)

メールマガジン
無料で購読
メールアドレス *
* 必須項目

【案内板】

このブログをはじめて読んだあなたへ
ぜひ読んでもらいたい記事を用意しました。

オンラインショップあります

↓ 下のバーナーをクリックすると移動します。