びっくりしました。iPhone全部じゃなくて、iPhoneのChromeでは表示されますが、Safariでは表示されないのです。
設定のSafariのプライバシー設定で「サイト超えトラッキングを防ぐ」をオフにすると表示されます。
iOS のedgeでもGoogle driveのイメージを再生しない場合はクッキーをブロックしないを選ぶ pic.twitter.com/OLXpkuGIuf
— なるべくすぐやる さいきゆみ (脱原発数十年) (@yumisaiki) September 4, 2021
サーバー代を使わないホームページを作りたいと思って研究してきましたが、もうだめかと思ったけど、このようにSafariの人には注意を入れるということで対応しました。
それから、iOSのedgeは、プライバシーとセキュリティの一番下のCookieを ブロックしないにすることで表示できます!
webpもiosでは、Chromeでも表示されませんでした。 やる気になってたけど残念!
https://drive.google.com/uc?export=view&id=ここに個別のID
これで画像を表示させるので、
画像を変更したくなったら同じ名前にしてアップロードしたら自動で更新されるわけです。
しかも、無料で(15Gまでだけど)
こんな便利なものはないので、もうSafariはひと手間かけてもらうことで対応。
これは、画像を表示する.carousel-innerの直下に、DIV(.ios)を作り、
.carousel-inner{position: relative;}
.ios{display:none;position:absolute;z-index:-1;}
/* safari対応 */
_:lang(x)+_:-webkit-full-screen-document, .ios{
display:block;text-align:cnter;top:15px;left:5px;}
.carousel-innerを、position: relative;にして、
DIV(.ios)を作り、position:absolute にして
として、z-index:-1 マイナス にするのが肝で、画像の下に表示させることができる。
下に設定しただけではだめで、-1にしないと駄目だった。
知らなかったわ。 もう苦労したー
わかってくれる人は少ないけどさー。
カバーページのイメージサイズは、2560-1440です。こちらのサイトが参考になる
![](https://hbb.afl.rakuten.co.jp/hgb/14cb81af.505092d8.14cb81b0.12740967/?me_id=1316260&item_id=10001746&pc=https%3A%2F%2Fthumbnail.image.rakuten.co.jp%2F%400_mall%2Fewin%2Fcabinet%2Fw%2F100735%2F100735-02.jpg%3F_ex%3D300x300&s=300x300&t=pict)
![](https://hbb.afl.rakuten.co.jp/hgb/21447ec0.4b8450c2.21447ec1.343a1b36/?me_id=1381741&item_id=10000027&pc=https%3A%2F%2Fthumbnail.image.rakuten.co.jp%2F%400_mall%2Fana-findelish%2Fcabinet%2Fmix-top-gift0527.jpg%3F_ex%3D300x300&s=300x300&t=pict)
検索していて見つけた、すっきり作ってるGoogle site どうしようもない、サイトネイムをもはやスルーして、メニューのタイトル HOMEをサイト名にすることで切り替えている…すばらしいアイデアだと思った。
0 コメント :
コメントを投稿
コメントありがとうございます。