This is the story I tried to show tool tip in Ruby On Rails.
It’s simple. Show help message when it is clicked, and hide message when it is clicked again. はてなマークがクリックされたらツールチップを表示・非表示するということです。
I used javascript (jQuery) and CSS. And I created useful method in helper as follows.
Environment
- Ruby 1.8.7p374
- Rails 3.0.1
- jQuery 1.4.3
Base
上のように javascript と css を記述して、次のように HTML を書きます。
image/quotation.png はクリックするモノです。その画像をクリックすると表示・非表示が切り替えます。
正確にいうなら、画像を囲んでいる span をクリックすると、その直後のタグの表示・非表示を切り替えます。つまりクリックするものは画像でなくてもよく、もっというならツールチップ以外にも使えるということです。
Use helper
Rails prepares helper component.
このメソッドを次のようにして使うと、上に書いた HTML のように出力されます。
Second argument has default value, so we don’t have to set any value to it.
私がこの tooltip 表示を書き始めたら ほかの人が随所で真似し始めたので、もっと楽にできる helper のメソッドを作ったというお話でした。