How to add link in tip

[monica]

Hello there, I am wondering if anyone can tell me how I add a link into the qtip popup? I am a bit of beginner, so maybe this is obvious. Currently, I have the popup text in the title tag. This is what my code looks like and I attached an image of the result. Thank you so much for any assistance

JS Code

<p class="quickanswer">
      <a href="#" title="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam rutrum dui et augue commodo sed pharetra dui convallis. Mauris ultrices, velit id sollicitudin consequa. ">
      This is a question?
      </a>
      </p>

[Craig]

monica, if you require HTML in your qTip I'd suggest moving from element attributes to actual tooltip elements on the page e.g.

JS Code

<p class="quickanswer">
      <a class="hasTooltip" href="#">This is a question?</a>
      <span class="tooltipContent">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam rutrum dui et augue commodo sed pharetra dui convallis. Mauris ultrices, 
      velit id sollicitudin consequa.</span>
</p>

Then use something similar to this:

JS Code

giveTooltips.each(function(){
   // Skip if no .tooltipContent is found next to this element
   if( $(this).next('.tooltipContent').length < 1 ) { return true; }
 
   $(this).qtip({
      content: $(this).next('.tooltipContent')
   });
});

[monica]

Craig,
Thanks for the tip. The only question I have is:
Where do you put the "givetoolTips..." code?

(4th March 15:38)Craig Wrote:  monica, if you require HTML in your qTip I'd suggest moving from element attributes to actual tooltip elements on the page e.g.

JS Code

<p class="quickanswer">
      <a class="hasTooltip" href="#">This is a question?</a>
      <span class="tooltipContent">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam rutrum dui et augue commodo sed pharetra dui convallis. Mauris ultrices, 
      velit id sollicitudin consequa.</span>
</p>

Then use something similar to this:

JS Code

giveTooltips.each(function(){
   // Skip if no .tooltipContent is found next to this element
   if( $(this).next('.tooltipContent').length < 1 ) { return true; }
 
   $(this).qtip({
      content: $(this).next('.tooltipContent')
   });
});

[Craig]

Wrap it in a $(document).ready() callback and stick it at the footer of the page.

[stefanogrini]

Hi,
Hi, my name is Stefano founder of monujo, a budget management startup from italy

I try to integrate qtip to my wordpress blog in the same way written here

http://www.comespendo.it/2011/05/27/obie...sparmio-2/

see the widget in sidebar "Nuovi Iscritti"

the code is this

HTML Code

<div class="user"><a href="http://www.comespendo.it/author/admin/"><span class="avatar"><img src="http://0.gravatar.com/avatar/21fbab9a04fc3cc884ccff1dc64eb1d6?s=50&d=wavatar&r=G" class="avatar avatar-50 photo" height="50" width="50" alt="admin" title="admin"></span><div class="tooltipContent"><span class="avatar"><img src="http://0.gravatar.com/avatar/21fbab9a04fc3cc884ccff1dc64eb1d6?s=50&d=wavatar&r=G" class="avatar avatar-50 photo" height="50" width="50" alt="admin" title="admin"></span><div id="qa-user-details">
			<img src="http://www.comespendo.it/wp-content/themes/platformpro/images/icons/rank3.gif"> Livello 3 : <b>100</b> <b>Nome</b> : admin
</div></div></a></div>

and in footer i added this

JS Code

<script class="example" type="text/javascript">
// Create the tooltips only on document load
$(document).ready()
{
giveTooltips.each(function(){
  // Skip if no .tooltipContent is found next to this element
  if( $(this).next('.tooltipContent').length < 1 ) { return true; }
 
  $(this).qtip({
     content: $(this).next('.tooltipContent')
  });
});
});
</script>

but qtip is not working

what have I made wrong ?

searching also for a developer in order to fix this bug

regards
Stefano

[Craig]

Well I can't see any tooltipContent elements in your code, so maybe that's why

[stefanogrini]

mmm, in the sidebar here http://www.comespendo.it/2011/05/27/obie...sparmio-2/ under Nuovi Iscritti widget

there is a here is <div class="tooltipContent"> ....

is it not ok ?

thanks for your answer