spot7.org logo
Home PHP C# C++ Android Java Javascript Python IOS SQL HTML Categories

Jquery: Simple tooltip help please


Updated your Fiddle again. Adjustments were to add CSS for the text:

.hoverAble
{
  display:inline;
}

so the div with the text has not 100% width as previously. I've added the jquery

    var tPos = $(this).width() + 20;
    $('#myToolTip').css({"left" : tPos});

before the tooltip fades in so the position of the tooltip is to the left of the div with the width of the div and added 20px as value for left.

Update: For the question in the comment if it's possible not to display the title on hover - just updated the Fiddle with the following adjustments: in case you don't need to have a title attribute on the <div> and only used it to store the copy for the tooltip, just change it to a data-attribute like data-title:

<div class="hoverAble" data-title="I
am blah!">sdddd</div>

and adjust the copy for the tooltip to retrieve the value of the data-title attribute:

var tip = "RRR " +
$(this).data('title');

In case you really need the title attribute on the <div>, it's possible to remove it on hover and add it again with the value of the data-title attribute when the tooltip faded out.

For reference: http://api.jquery.com/data/


Categories : Jquery

Related to : Jquery: Simple tooltip help please
Jquery Tooltip animation
You're selecting the value on page load. You are then setting the value used in the page load to be the tooltip to use every time. You're also changing all the tooltips of the page at once by registering the event on document-level. Change your code to this for it to behave in the correct way: $( '#ime' ).tooltip({ show: { effect: $( "#effect" ).val(), delay: 50 }, position: {

Categories : Jquery
tooltip positionining and hiding tooltip immedately after mouse is moved out
instead of implementing your own "close" function you simply can set the show and hide properties to false when creating the tooltip. have a look at the documentation show / hide $(document).tooltip({ content: function () { return $(this).prop('title'); }, show: false, hide: false });

Categories : Javascript
JQuery changing tooltip message on hover, depending on divs state
Your function in which you attached hover event is inside of click event. So just move it outside of the click event and it should work. Also, as I can see you are using jQuery UI, so don't forget to add reference to that library too. In your html code posted you have one extra closing div. Here is HTML: <div id="needle"> <div id="arrowDiv"> <img id="imgArrows" src="../Style/

Categories : Jquery
Simple, jQuery Password Screen?
Here's my take on it, using some hilariously insecure password obfuscating with .fromCharCode() (Hint: The password is "hunter2") var arr = [104, 117, 110, 116, 101, 114, 50]; var str = ''; arr.forEach(function (val, index) { str += String.fromCharCode(val); }) $('#form').on('submit', function (event) { event.preventDefault(); var pw = $(this).find('#password'); if ( pw.val() ==

Categories : Jquery
Simple jquery image slider with centralized slides
In order to center an image using cycle2.js (see the comment string on the question), you can use the following after the slideshow is initialized. $('.cycle-slideshow').on('cycle-before',function(e,opts){ // move the slides to the center of the box $('.cycle-slide').each(function() { centerImage($(this)); }); }); And then create the centerImage func

Categories : Javascript
Recently Add
Update notifications via Ajax
Revert a jQuery function, from xml to html and back
How do I make auto zoom with jquery
Kendo Datepicker inside Kendo Grid Tabstrip - Invalid Template
Force data-ajax="false" on a redirect, or on a certain page load
check if an element has data attribute attached to it?
JQuery Autocomplete Reduce Suggestions
If input value = "word"
Hide a field each time an input from a specified form is changed
Cross domain AJAX Request with Sinatra not working - sending JSON with jQuery.ajax
How to Iterate Enumerable List using Razor and check whether it contains a textbox value
jquery file upload plugin file upload without refreshing the page
Chosen-rails for active admin form
make inner div wider than the outer div
reponsive menu not working when i use variables
npm jquery, which is the correct one to support older browsers
How to find out which side the mouse enter in RTL
Check if Youtube video ID match else load a new video id
unable to use two sliders together
Jquery Select on select
Issue in Calling WebService by jquery Ajax
bootstrap multiselect : TypeError: $(...).multiselect is not a function
Show success or failure message on form.submit()
bootstrap variable grid design layout structure
Add different animate.css class to different divs via a single jquery statement
Changing the image source of a droppable with a draggable image
jquery autocomplete not showing dropdown
Is there another method other than ctrl-p to get print dialog box in datatable print?
how to insert json Data into Sqlite DB in PhoneGap
The toggleClass duration doesn't work on pseudo-elements
© Copyright 2017 spot7.org Publishing Limited. All rights reserved.