Ok, this is rather strange:
I begin with a list of images like this:
<ul class="list_images">
<li><img src="images/imag1.png"/></li>
<li><img src="images/imag2.png"/></li>
<li><img src="images/imag3.png"/></li>
</ul>
then I include the following piece of jQuery script at $(document).ready:
$(".list_images img").each(function(){$(this).wrap("<a
href='"+$(this).attr("src")+"' class='thickbox'></a>");});
as expected, the result is the following modified list, right what I needed
to be able to apply the thickbox effect:
<ul class="list_images">
<li><a class="thickbox" href="images/imag1.png"><img
src="images/imag1.png"/></a></li>
<li><a class="thickbox" href="images/imag2.png"><img
src="images/imag1.png"/></a></li>
<li><a class="thickbox" href="images/imag3.png"><img
src="images/imag3.png"/></a></li>
</ul>
Everything is working smoothly so far, but when I load the page in Firefox
and click on the images, the lightbox doesn't appear at all and I'm
redirected to a blank page with only the image I expected to see (not the
effect I'm looking for). Plus, Firebug warns me that theres an error, but
I've investigated it and it doest the same everytime you try to load an
image in Firefox when it's not inside a HTML document.
And this is when things get freaky: I copy-paste that modified list into a
blank document, load it and guess what: it works! But why can't I generate
the list dynamically? I'm trying to separate content from presentation in
three layers (HTML, script and CSS), so I would really like to make it work.
Plus, it's driving me crazy.
Thanks in advance.
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/
