Hi Brian,
Yes, an ID absolutely must be unique for a given document if you want
any DOM operations to run predictably. Might I suggest using a class
name instead? Instead of this ...
$('#glossary').cluetip({
try this ...
$('a.glossary').cluetip({
And instead of this ...
<a id="glossary" href="#" title="Social Security|definition
here">Social Security</a>
<a id="glossary" href="#" title="Benefit|definition here">Benefit</a>
<a id="glossary" href="#" title="Will|definition here">Will</a>
etc.
try this ...
<a class="glossary" href="#" title="Social Security|definition
here">Social Security</a>
<a class ="glossary" href="#" title="Benefit|definition here">Benefit</
a>
<a class ="glossary" href="#" title="Will|definition here">Will</a>
etc.
Hope that helps
--Karl
_________________
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Mar 28, 2008, at 6:11 PM, ooper wrote:
I'm using cluetip to show glossary definitions on a page that has an
article on it. I can only get the first cluetip to work correctly. Not
sure what I am doing wrong.
Here is my script:
<script type="text/javascript">
$(document).ready(function() {
$('#glossary').cluetip({
splitTitle: '|', // use the invoking element's title attribute to
populate the clueTip...
// ...and split the contents into separate divs
where there is a "|"
showTitle: true,
arrows: true,
dropShadow: true,
positionBy: 'mouse'
});
});
</script>
And then I have a bunch of anchor tags throughout the html page that
look something like this:
<a id="glossary" href="#" title="Social Security|definition
here">Social Security</a>
<a id="glossary" href="#" title="Benefit|definition here">Benefit</a>
<a id="glossary" href="#" title="Will|definition here">Will</a>
etc.
Ideas? Does the id or the href have to be unique for each one?
TIA,
Brian Barnett