jQuery checkbox tooltip

Question

I use the following jQuery function for tooltip on input text, textarea and dropdown:

$(function() {
$("#addmovie-form :input:not(:button):not(:submit):not(:reset)").tooltip({
        position: "center right",
        offset: [-2, 10],
        effect: "fade",
        opacity: 0.7

    });
});

I add then a tooltip to a text, textare or dropdown with code:

$('#add-titel').prop("title", "my title ...");

This is working fine on text, textarea and dropdown inputs.

Now I have also multiple checkboxes inside the form and If I assign a tooltip to the checkbox id's, the tooltip is not displayed. Also the checkboxes are jumping around on mouseover like this:

example before

example after mousehover

Does someone have a solution for this?

I also thought, it would be better to put a html table around the whole checkboxes and display the tooltip on table hover. I found some TD or TR jquerys for this, but i can't get it to work on the complete table.

try to add tool-tip on checkboxes label or try to wrap checkbox in span and add tooltip on it — webdevanuj
– webdevanuj, Commented Jul 16, 2016 at 15:25
Thanks for the answer. i didn't even know you can do it with span.Thank you, now it is working. I got the code from here: w3schools.com/css/css_tooltip.asp — grusl83
– grusl83, Commented Jul 16, 2016 at 16:34

webdevanuj · Accepted Answer · 2016-07-16 17:25:14Z

1

try to add tool-tip on checkboxes label or try to wrap checkbox in span and add tooltip on it

answered Jul 16, 2016 at 17:25

webdevanuj

67512 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

jQuery checkbox tooltip

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related