Lightbox not working with tabs/ajax pagination combo

[smswetz]

So I'm trying to figure this out here, and I've done some research, but nothing seems to exactly fit my problem.

I am working on my portfolio, and I have 3 tabs to display each type of work (Web, Print, Multimedia). Each tab allows for 8 pieces of work, which are pulled from an external php page.

HOWEVER, some sections are going to have more than just 8 pieces of work to show, so to keep from reloading the page to call another set of images, I used an AJAX pagination script, which works quite good.

But now I can't seem to figure out how to get the lightbox to work, since the links are pulled from external pages, I know that they have to be polled or loaded, but anything I've seen hasn't wanted to work.

You can view my site at http://www.chromaticstudios.net/work.php (the print section is the one currently up and running). Any ideas what to do?

I also don't like the way that I'm doing this, so if anyone has an easier, less messy, and less JS reliant way to do it, I'm open for suggestions!

[jscheuer1]

You should be able to use the 'manual' method. First, get rid of all that polling stuff.

Now, I see that print.php has some invalid code on it (for one, two titles, for another, multiple elements with the same id, an element or elements with the same id as an element or elements on the work.php to which it is being imported, there could be other issues). But that shouldn't matter if we create the right division on it for jQuery lightbox initialization and give that division a totally unique id.

Anyways, with this method, you don't need the rel="lightbox-nvGroup" for the links, and it may even cause problems, so get rid of it.

Next, place a division around all of the links on print.php that you wish to be in the group, and give it a totally unique id and the exact onmouseover event shown (make no changes to it):


<div id="myuniquegal_1" onmouseover="$('#' + this.id + ' a').lightbox();this.onmouseover=function(){return;};">

all the links in this group go here

</div>

That's it, nice and simple. However , there may or may not issues with doing this multiple times. I leave that to you to test.

[smswetz]

You made my day, I'm going to have to seriously go through the code and fix the elements with the same id's..that would explain why I can't style the pagination links. I'm happy it works though....I can't thank you enough haha.