turbo

RailsのHotwireでCSSアニメーションさせる方法(登録処理もTurbo/Stimlusで実装)

昨日の続きです。 RailsのTurboでAjaxで要素を削除したときにCSSアニメーションさせる方法2(Stimlus化) 画像の登録もTurbo/Stimulusで実施してなかったので修正してみます。 やってみる css fade-in用を追加。 .fade-in { animation: fade-in .4s linear; …

RailsのTurboでAjaxで要素を削除したときにCSSアニメーションさせる方法2(Stimlus化)

RailsのTurboでAjaxで要素を追加したときにCSSアニメーションさせる方法 では、application.js に記載していましたが、これをStimulus化して利用しやすくしてみます。 やってみる stream_animations_controller.js import { Controller } from "@hotwired/st…

RailsのTurboでAjaxで要素を削除したときにCSSアニメーションさせる方法

Ajaxでデータ追加・削除するのにRailsのTurbo便利ですよね。 でも、CSSアニメーションが効かなくて困ってました。 Turbo以前 image-wrapperクラス以下に画像とxボタンを配置します。 # haml .image-wrapper.position-relative = image_tag image = link_to u…