Databases
StackOverflow2013
Postsdbo
POTooltip on the postion where i hover
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POTooltip on the postion where i hover
    primarykey
    data
    text
    <p>i have used <a href="http://net.tutsplus.com/tutorials/javascript-ajax/build-a-better-tooltip-with-jquery-awesomeness/" rel="nofollow">this</a> tooltip in my project its working great but the problem is that i need the tooltip appear where ever i hover and not fixed location.currently its appearing in fixed location.i need to appear the tooltip where i hover.</p> <p>how can i retouch this code to do so</p> <pre><code> /* Position the tooltip relative to the class associated with the tooltip */ setTip = function(top, left){ var topOffset = tip.height(); var xTip = (left-30)+"px"; var yTip = (top-topOffset-60)+"px"; tip.css({'top' : yTip, 'left' : xTip}); } </code></pre> <p>the full code is here</p> <pre><code> $.fn.betterTooltip = function(options){ /* Setup the options for the tooltip that can be accessed from outside the plugin */ var defaults = { speed: 200, delay: 300 }; var options = $.extend(defaults, options); /* Create a function that builds the tooltip markup. Then, prepend the tooltip to the body */ getTip = function() { var tTip = "&lt;div class='tip'&gt;" + "&lt;div class='tipMid'&gt;" + "&lt;/div&gt;" + "&lt;div class='tipBtm'&gt;&lt;/div&gt;" + "&lt;/div&gt;"; return tTip; } $("body").prepend(getTip()); /* Give each item with the class associated with the plugin the ability to call the tooltip */ $(this).each(function(){ var $this = $(this); var tip = $('.tip'); var tipInner = $('.tip .tipMid'); var tTitle = (this.title); this.title = ""; var offset = $(this).offset(); var tLeft = offset.left; var tTop = offset.top; var tWidth = $this.width(); var tHeight = $this.height(); /* Mouse over and out functions*/ $this.hover( function() { tipInner.html(tTitle); setTip(tTop, tLeft); setTimer(); }, function() { stopTimer(); tip.hide(); } ); /* Delay the fade-in animation of the tooltip */ setTimer = function() { $this.showTipTimer = setInterval("showTip()", defaults.delay); } stopTimer = function() { clearInterval($this.showTipTimer); } /* Position the tooltip relative to the class associated with the tooltip */ setTip = function(top, left){ var topOffset = tip.height(); var xTip = (left-30)+"px"; var yTip = (top-topOffset-60)+"px"; tip.css({'top' : yTip, 'left' : xTip}); } /* This function stops the timer and creates the fade-in animation */ showTip = function(){ stopTimer(); tip.animate({"top": "+=20px", "opacity": "toggle"}, defaults.speed); } }); }; </code></pre>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. This table or related slice is empty.
    1. USEdward Maya
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POTooltip on the postion where i hover
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. POTooltip on the postion where i hover
      1. This table or related slice is empty.
      1. VTUpMod
    3. VO
      singulars
      1. POTooltip on the postion where i hover
      1. USbharal
      1. VTFavorite
    1. COI believe @Hidde's answer below solves your issue, but I would suggest using a well tested plugin that deals with loads of scenarios rather than reinventing the wheel! One I would suggest is http://bassistance.de/jquery-plugins/jquery-plugin-tooltip/ but there's more out there. I wouldn't discourage to use the above as a learning experience, but otherwise, I'd stick with well tested code.
      singulars
      1. POTooltip on the postion where i hover
      1. USbPratik
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload