<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
    <channel>
        <title>フェードイン on qwerty.work</title>
        <link>https://qwerty.work/tags/%E3%83%95%E3%82%A7%E3%83%BC%E3%83%89%E3%82%A4%E3%83%B3/</link>
        <description>Recent content in フェードイン on qwerty.work</description>
        <generator>Hugo -- gohugo.io</generator>
        <language>ja-JP</language>
        <lastBuildDate>Wed, 27 Sep 2023 09:38:39 +0900</lastBuildDate><atom:link href="https://qwerty.work/tags/%E3%83%95%E3%82%A7%E3%83%BC%E3%83%89%E3%82%A4%E3%83%B3/index.xml" rel="self" type="application/rss+xml" /><item>
            <title>【STUDIO】カルーセルのスライドショーをふわっとフェードイン・フェードアウトさせる方法</title>
            <link>https://qwerty.work/post/2023/09/studio-carousel/</link>
            <pubDate>Wed, 27 Sep 2023 09:38:39 +0900</pubDate>
            <guid>https://qwerty.work/post/2023/09/studio-carousel/</guid>
            <description>&lt;h2 id=&#34;カルーセルの画像の入れ替え方法を変更したい&#34;&gt;カルーセルの画像の入れ替え方法を変更したい&#xA;&lt;/h2&gt;&lt;p&gt;STUDIOのカルーセルの写真入替の動きに疑問がでてきました。画像が入れ替わる際に画面がちらついて、シックで上品、落ち着いた雰囲気のサイトを作るときにチラつきが気になります。&lt;/p&gt;&#xA;&lt;ul&gt;&#xA;&lt;li&gt;スライドの方向は左→右の一択しかないのかな？&lt;/li&gt;&#xA;&lt;li&gt;カクカクする挙動を滑らかでスムーズな動きにできない？&lt;/li&gt;&#xA;&lt;/ul&gt;&#xA;&lt;p&gt;そこで、ふわっとフェードイン・フェードアウトで入れえる方法がありました。ただ、この通りにしてもうまくいきませんでしたが、今後の参考としてメモしておきます。&lt;/p&gt;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;  &#xA;&#xA;&#xA;&lt;div class=&#34;link-card&#34;&gt;&#xA;  &lt;a href=&#34;https://studio.galera.co.jp/blog/eOddb9My&#34; target=&#34;_blank&#34; rel=&#34;noopener noreferrer&#34;&gt;&#xA;    &#xA;    &lt;div class=&#34;link-card-image&#34;&gt;&#xA;      &lt;img src=&#34;https://image.thum.io/get/width/300/crop/200/https://studio.galera.co.jp/blog/eOddb9My&#34; alt=&#34;https://studio.galera.co.jp/blog/eOddb9My&#34; loading=&#34;lazy&#34;&gt;&#xA;    &lt;/div&gt;&#xA;    &#xA;    &lt;div class=&#34;link-card-body&#34;&gt;&#xA;      &lt;span class=&#34;link-card-title&#34;&gt;https://studio.galera.co.jp/blog/eOddb9My&lt;/span&gt;&#xA;      &#xA;      &lt;span class=&#34;link-card-url&#34;&gt;https://studio.galera.co.jp/blog/eOddb9My&lt;/span&gt;&#xA;    &lt;/div&gt;&#xA;  &lt;/a&gt;&#xA;&lt;/div&gt;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;  &#xA;&#xA;&#xA;&lt;div class=&#34;link-card&#34;&gt;&#xA;  &lt;a href=&#34;https://note.com/youile3/n/n3cecc06c00f4&#34; target=&#34;_blank&#34; rel=&#34;noopener noreferrer&#34;&gt;&#xA;    &#xA;    &lt;div class=&#34;link-card-image&#34;&gt;&#xA;      &lt;img src=&#34;https://image.thum.io/get/width/300/crop/200/https://note.com/youile3/n/n3cecc06c00f4&#34; alt=&#34;https://note.com/youile3/n/n3cecc06c00f4&#34; loading=&#34;lazy&#34;&gt;&#xA;    &lt;/div&gt;&#xA;    &#xA;    &lt;div class=&#34;link-card-body&#34;&gt;&#xA;      &lt;span class=&#34;link-card-title&#34;&gt;https://note.com/youile3/n/n3cecc06c00f4&lt;/span&gt;&#xA;      &#xA;      &lt;span class=&#34;link-card-url&#34;&gt;https://note.com/youile3/n/n3cecc06c00f4&lt;/span&gt;&#xA;    &lt;/div&gt;&#xA;  &lt;/a&gt;&#xA;&lt;/div&gt;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;  &#xA;&#xA;&#xA;&lt;div class=&#34;link-card&#34;&gt;&#xA;  &lt;a href=&#34;https://studio.re-d.jp/journal/20230406/459/&#34; target=&#34;_blank&#34; rel=&#34;noopener noreferrer&#34;&gt;&#xA;    &#xA;    &lt;div class=&#34;link-card-image&#34;&gt;&#xA;      &lt;img src=&#34;https://image.thum.io/get/width/300/crop/200/https://studio.re-d.jp/journal/20230406/459/&#34; alt=&#34;https://studio.re-d.jp/journal/20230406/459/&#34; loading=&#34;lazy&#34;&gt;&#xA;    &lt;/div&gt;&#xA;    &#xA;    &lt;div class=&#34;link-card-body&#34;&gt;&#xA;      &lt;span class=&#34;link-card-title&#34;&gt;https://studio.re-d.jp/journal/20230406/459/&lt;/span&gt;&#xA;      &#xA;      &lt;span class=&#34;link-card-url&#34;&gt;https://studio.re-d.jp/journal/20230406/459/&lt;/span&gt;&#xA;    &lt;/div&gt;&#xA;  &lt;/a&gt;&#xA;&lt;/div&gt;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;&#xA;  &#xA;&#xA;&#xA;&lt;div class=&#34;link-card&#34;&gt;&#xA;  &lt;a href=&#34;https://spicato.com/blog/12/0411denblog/&#34; target=&#34;_blank&#34; rel=&#34;noopener noreferrer&#34;&gt;&#xA;    &#xA;    &lt;div class=&#34;link-card-image&#34;&gt;&#xA;      &lt;img src=&#34;https://image.thum.io/get/width/300/crop/200/https://spicato.com/blog/12/0411denblog/&#34; alt=&#34;https://spicato.com/blog/12/0411denblog/&#34; loading=&#34;lazy&#34;&gt;&#xA;    &lt;/div&gt;&#xA;    &#xA;    &lt;div class=&#34;link-card-body&#34;&gt;&#xA;      &lt;span class=&#34;link-card-title&#34;&gt;https://spicato.com/blog/12/0411denblog/&lt;/span&gt;&#xA;      &#xA;      &lt;span class=&#34;link-card-url&#34;&gt;https://spicato.com/blog/12/0411denblog/&lt;/span&gt;&#xA;    &lt;/div&gt;&#xA;  &lt;/a&gt;&#xA;&lt;/div&gt;&#xA;&#xA;</description>
        </item></channel>
</rss>
