Hi Bill,
When I began writing this plugin, I had to make a number of decisions
regarding the tooltip behavior, one of which had to do with whether it
could show multiple tooltips or just one. I opted for just one.
I'm not sure what Jörn's tooltip plugin allows, but you might want to
check that one out. Also, jqModal or a similar dialog-type plugin
might suit your needs better.
--Karl
_________________
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Feb 8, 2008, at 1:49 AM, Bill wrote:
I've got a clueTip that brings in content using AJAX (the code is
below). The onShow action creates another clueTip from a class within
the first, "parent", cueTip. So I have a clueTip inside a clueTip.
This works fine except that when I hover over the inner clueTip
element the outer, "parent", clueTip is automatically closed and
disappears. Is there any way to keep the outer or "parent" clueTip
from closing in this applicaiton?
I'm new at this so maybe this is not what cueTips are intended for.
Is there some other plugin I should be using? Any recommendations?
Thanks,
Bill
------------- main.html ---------------
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.dimensions.js"></
script>
<script type="text/javascript" src="jquery.hoverIntent.js"></
script>
<script type="text/javascript" src="jquery.cluetip.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.outer').cluetip({
dropShadow: false,
showTitle: true,
sticky: true,
closePosition: 'title',
arrows: true,
onShow: function(){
$('.inner').cluetip({
dropShadow: false,
showTitle: true,
sticky: true,
closePosition: 'title',
arrows: true
});
return true;
},
ajaxCache: false
});
});
</script>
<link rel="stylesheet" href="jquery.cluetip.css" type="text/css" />
</head>
<body>
<p><span class="outer" rel="outer.html" title="Outer clueTip">Hover
for Outer clueTip</span></p>
</body>
</html>
------ outer.html --------
<html>
<head>
</head>
<body>
<p><span class="inner" rel="inner.html" title="Inner clueTip">Hover
for Inner clueTip</span></p>
</body>
</html>
------ inner.html -------
<html>
<head>
</head>
<body>
<p>Inner clueTip contents</p>
</body>
</html>
