In Prettyphoto.js or Fancybox... How to add a link within the caption

jquery fancybox shadowbox
ive picture ive · Feb 2, 2011 · Viewed 8.1k times · Source

Help! I'm working on a website for a team of writers.

They want to show examples of specific jobs they've worked on (portfolio) by using the shadowbox effect.

Once opened (in overlay) the picture which is actually a screenshot of a .doc for instance, would have a caption to explain it roughly. The thing is, they want a link inside the caption so the user can download the files (.doc, .pdf) to their desktop or link to another site that they haved worked on.

I've managed to do it with Fancybox but the way the link is included in the it shows undesirable text when hovered (the browser yellow tooltip).

Here is the code:

<a class="group" rel="portfolio"
 href="../../images/pf_nat/cfcBig.png" title="Rédaction de plus de 300 articles. <a href='http://www.groupecfc.com/fr-Ca/' target='_blank'>Visiter le site</a>"><img src="../../images/pf_nat/tn_nat_cfcBig.gif" alt="" width="40" height="40"/></a>

in this case it's a link to some site.

Answer

Scott Brown picture Scott Brown · Feb 2, 2011

If it's like most 'lightbox' plugins, I believe you need to do this use character entities for example:

<a href="test.html">hello</a>

would become

&lt;a href=&quot;text.html&quot;&gt;hello&lt;/a&gt;

Put this in your title tag and it will link.

Get a full list of HTML character entities at http://en.wikipedia.org/wiki/List_of_XML_and_HTML_character_entity_references

Related questions

How to launch jQuery Fancybox on page load?

I would like to launch a Fancybox (e.g. Fancybox's version of a modal or light box) on page load. I could bind it to a hidden anchor tag and fire the click event of that anchor tag via JavaScript, …

Read More
close fancy box from function from within open 'fancybox'

Hi all i want to be able to close fancyBox when it is open from within. I have tried the following but to no avail: function closeFancyBox(html){ var re = /.*Element insert complete!.*/gi; if( html.search( re ) == 0 ){ $.fancybox.close(); //…

Read More
Open fancybox from function

I am trying to open a fancybox from a function I have - in short my HTML code looks like this; <a href="#modalMine" onclick="myfunction(this); return false;"> click </a> and a part of my …

Read More