RAILSアプリにjQueryを入れ始めました。
fadeInメソッドを使ってトップページの見出し文字をゆっくり表示させるようにしました。
最初にサイトに訪れたり更新のときはfade Inでゆっくり表示されるのですが
link_to(アンカー)でトップページに飛んだ際はfadeInが起こらず表示されません。
アンカー先でfadeInを起こすにはどのように指定したら良いのでしょうか?
トップページ ビュー (/)
top.html.erb
1 <div class="top-message" id="top-message"> 2 <h1>言葉はヒトを豊かにする。</h1> 3 <p>いまの気持ちを言葉にしよう!</p> 4 </div>
トップページ CSS
home.css
1 .top-message{ 2 text-align:center; 3 display: none; 4 }
トップページ js
home.js
1$(function() { 2 $("#top-message").fadeIn(1400); 3});
アプリケーションHTML
application.html.erb
1 <div class="header-logo"> 2 <%= link_to("トップページ", "/") %> 3 </div>
↑目次のこのリンクからトップページに飛ぶとCSSのdisplay:none;は反映されてますが、jsのfadeInは起こらないです。
ここでとんだあとにもfadeInを起こしたいです。
回答2件
あなたの回答
tips
プレビュー