jQuery
を使用してフェードインとフェードインの効果を持つフラッシュメッセージを使用しようとしています。誰かがこれを行う最善の方法をお勧めしますか?フラッシュメッセージのフェード効果
17
A
答えて
53
確か:
$(function() {
$('#flash').delay(500).fadeIn('normal', function() {
$(this).delay(2500).fadeOut();
});
});
1
これは、上記のヤコブの答えの変形例です。 最初に隠されていないものをフェードインできません。
指示:これはのように、あなたのフラッシュメッセージにフラッシュのIDを入れて
(私のフラッシュメッセージがここに格納されているアプリ/ビュー/レイアウト/ _flashmessages.html.erb):<% flash.each do |key, value| %>
<div class="well lead" id="flash"><%= value %></div>
<% end %>
メイク
jQuery ->
$('#flash').hide().delay(800).fadeIn(800).delay(4000).fadeOut(800)
:
資産/ JavaScriptの/ flash.js.coffeeと呼ばれる新しいファイルには、(すべてのくぼみがタブであることを確認し、スペースに注意)でこれを置きます
関連する問題
- 1. レイアウト間のフェード効果
- 2. リンクの色にフェード効果
- 3. LinearLayoutフェード効果の内容
- 4. Androidライブ壁紙フェード効果
- 5. Mootools 1.4.3背景フェード効果
- 6. Javascriptのdisplay = "block"アクションのフェード効果
- 7. ui-bootstrap(Angular.JS)のタブのフェード効果
- 8. Slickのカルーセルエッジでのフェード効果
- 9. jQueryのアニメーションやフェード効果は一緒
- 10. Vue.jsページ遷移フェード効果とvue-router
- 11. ブートストラップカルーセルにフェード効果を追加する
- 12. 同じ画像にフェードとケーンズ効果
- 13. フクロウカルーセル2フェード効果が働かない
- 14. フェード効果を持たないUIButtonを無効にする
- 15. フェード効果が効きません(ブートストラップ4)
- 16. Android adjustResize - フェード効果を無効にする方法
- 17. 自動フェード効果を無効にする
- 18. jQueryのテキスト回転子プラグインのフェード効果
- 19. Senchaフェード効果の実際の実施例
- 20. このフェードとスライドの効果を得るには?
- 21. jQueryのスライドアップとフェード効果を置き換える/ダウン
- 22. JavaScriptの間隔でフェード効果を使用
- 23. スクロールしてsrcを変更するときのJqueryフェード効果
- 24. Android - 規模とフェード効果で活性を開く方法
- 25. オーバーフローでフェード効果が発生する水平メニュー
- 26. jQueryとlocalScrollを使用してスライドアウトしてフェードする効果
- 27. カウンタ、サムネイル、プログレスバー、フェード効果を使用した簡単なjQueryスライドショー
- 28. 水平メニューからフェード効果を削除するには
- 29. JSフェード効果が機能しない(ループ用)
- 30. 水平スクロールdivでフェード効果を作成する方法
が完璧です。ありがとう! –
あなたはf * ckn '人です!このことについて強調されました – franklinexpress
fadeINが機能しない、うまく動作する - http://stackoverflow.com/questions/24278586/fade-not-working-for-flash-message-in-rails興味があれば参照してください。ありがとうございました! – Peege151