AwesomeTooltip

Lightweight gem for loading tooltips on your page without preloading. With this gem you can load static template, or templates with data from the database.

Add this line to your applications' Gemfile:

gem 'awesome_tooltip'

And then execute:

$ bundle

1. Mount AwesomeTooltip routes in to your config/routes.rb

mount AwesomeTooltip::Engine => '/', as: 'awesome_tooltip'

2. Require AwesomeTooltip javascript in to your application.js. If you are using Rails 6 with webpack you must create app/assets/javascripts folder with application.js file and require javascript there.

//= require awesome_tooltip/tooltip

3. Require AwesomeTooltip styles in application.css:

/*
 *= require awesome_tooltip/tooltip
 */

4. Create a folder for you tooltip templates:

$ mkdir app/awesome_tooltips

5. Add a template:

$ echo '<h1>This is your tooltip with static template</h1>' > app/awesome_tooltips/template.html.erb

6. Add following code to your page:

<div class="awesome_tooltip" data-template="template">Element with tooltip</div>

For example, if you want a tooltip with some external info for a user, you can create a tooltip template with the following info in app/awesome_tooltips/user_info.html.erb folder:

<div class="user-info">
  <div class="user-fullname">
    <%= user.full_name %>
  </div>
  <div class="email">
    <%= user.email %>
  </div>
</div>

Then add the following code to your page:

<div class="awesome_tooltip" data-template="user_info" data-object="#{@user.class.name.downcase}-#{@user.id}"><%= @user.full_name %></div>

HTML attributes

If you want to override default javascript configuration, you can add the following code to you js file:

AwesomeTooltip({
  tooltipPath: '/your/custom/path/',
  delay: 2000,
  location: 'bottom'
});

• Add generators
• Add configs
• Add ability to place tooltip on the left and right side

• Fork it
• Create your feature branch (git checkout -b my-new-feature)
• Commit your changes (git commit -am 'Added some feature')
• Push to the branch (git push origin my-new-feature)
• Create new Pull Request

The gem is available as open source under the terms of the MIT License.