javascript - displaying tooltip using jquery in rails -


found pretty interesting question @ http://jsfiddle.net/ttfyc/15/ , decided incorporate project.

however, after following every code in line (even copy/paste), tooltip not showing up. demonstrated code below, every line identical jsfiddle. doing wrong here?

haml

%p.mastertooltip.add_stuff#add_trip= link_to ........ 

js

//= require jquery //= require bootstrap-sprockets //= require jquery_ujs //= require turbolinks //= require_tree . $(document).ready(function() {         // tooltip text         $('.mastertooltip').hover(function(){                 // hover on code                 var title = "hello world";                 $(this).data('tiptext', title).removeattr('title');                 $('<p class="tooltip"></p>')                 .text(title)                 .appendto('body')                 .fadein('slow');         }, function() {                 // hover out code                 $('.tooltip').remove();         }).mousemove(function(e) {                 var mousex = e.pagex + 20; //get x coordinates                 var mousey = e.pagey + 10; //get y coordinates                 $('.tooltip')                 .css({ top: mousey, left: mousex })         }); }); 

css

.tooltip {     display:none;     position:absolute;     border:1px solid #333;     background-color:#161616;     border-radius:5px;     padding:10px;     color:#fff;     font-size:12px arial; } 

you running conflict bootstrap or other framework defines tooltip class. rename class in js , css , work fine.


Comments