CODEWITHSUNDEEP
javascriptjquerycsssimpletip
del
del

Reputation: 6561

jQuery SimpleTip to generate tooltips over a table

I am using SimpleTip to generate a tooltip when the user hovers over a cell in a table. The tooltip shows, but it expands the size of the cell. How can I make it hover over the cell without changing its size?

Here's what I currently have: 

<html>
    <head>
        <script type="text/javascript" src="jquery.min.js"></script> 
        <script type="text/javascript" src="jquery.simpletip-1.3.1.js"></script> 
    </head>
    <body>
        <table border="1">
            <tr><td id="test">foobar</td></tr>
        </table>
        <script type="text/javascript">
            $("#test").simpletip({
               fixed: true,
               content: 'hello world!'
            });
        </script>
    </body>
</html>

Upvotes: 0

Views: 3895

Answers (3)

Dominic
Dominic

Reputation: 11

The reason is that SimpleTip does not use use a holder element like most other libraries. It rather puts the tooltip inside the tooltipped element. This works for some basic layouts but it does not work for others – especially ones that use relative/absolute positioning of elements.

So the solution is as proposed: Try it, if it doesn't work with your layout, try some other library.

Actually I have forked a tooltip based on SimpleTip 1.3.1 which has this issue fixed. I will be releasing it in a while. You probably have solved your problem in the meantime, though. :)

Upvotes: 0

Khoa Nguyen
Khoa Nguyen

Reputation: 1317

I recommend you using qTip (the successor to Simpletip) and it works with your case

Try this: http://jsfiddle.net/ynhat/PydCK/

Upvotes: 1

MikeMurko
MikeMurko

Reputation: 2233

Looks like you're using "simpletip" and not qTip in your code. That may be the reason why. What browser are you using? It's possible you might be using IE and without the right doctypes your page won't display properly.

I'll have to run your code and test it.

Upvotes: 0

Related Questions