ajicolor https://blog.hatena.ne.jp/ajicolor/ やわらかしかっけい https://ajicolor.hatenablog.jp/ HTML,CSS,javascript 背景画像のSVGがスライドショーのようにフェードで切り替わっていく、というのをやりたかった。 SVGである理由 綺麗だから 背景画像である理由 SVGだと、背景画像にしないとレスポンシブでのサイズ変更ができないから CSSのanimationで実装したらiOSのChromeでバグが出たので、 結果的にjQueryでやることになった。 CSS animationでやってみた 参考：https://webparts.cman.jp/box/bgfade/だいたいこんなような感じだったと思う。 画像5枚が30秒でゆっくり1周する。 html <div class="fade_img"> <div c… 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Fajicolor.hatenablog.jp%2Fentry%2F2023%2F02%2F13%2F193951" title="背景画像フェード切り替えをCSSでやろうとしたが、結局jQueryで実装した - やわらかしかっけい" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe> Hatena Blog https://hatena.blog 2023-02-13 19:39:51 rich https://ajicolor.hatenablog.jp/entry/2023/02/13/193951 1.0 100%