How can I make animated thumbnails for my gallery of videos?

Why won't my lightbox gallery show the third image?

  • Why won't my lightbox gallery show the third image? Hey, I'm stuck trying to create a gallery that is launched by clicking on a single thumbnail and then scrolls through to two additional images. For some reason it will only go between the first two images. And to make it extra odd if you click close while viewing the second image in the gallery it will take you to the third image in the next set! These galleries are launched by clicking on a thumbnail of only the first image while the next two are hidden links on the page. It's not working! Anyone have some advice? You can see the page here (the thumbnails that should launch a three image gallery are the last two in the left column and the last in the right): http://www.carlyh.com/print.html thanks!

  • Answer:

    Your "next" button is there after the 2nd image, it's just getting shoved below the lightbox...scroll down and roll your mouse outside the lightbox and you should see it.

matt_od at Ask.Metafilter.Com Visit the source

Was this solution helpful to you?

Other answers

(rather, roll your mouse around the caption area after you scroll down)...anyway, seems like a positioning problem that some adjusted CSS could fix.

circular

oh wow. hadn't noticed that! thanks circular. I'll take a look at the css. I'm still pretty novice at this stuff, so if anyone else cares to jump in that'd be cool. Not sure why the positioning for the next would move from one image to the next since I believe the script is applying to same css for each image... but yea... hah. confusing.

matt_od

I haven't tested this with your code, but my suspicion is that since you are using the ID "hide" multiple times, there is some funkiness going on especially when combined with JS. http://ryanfait.com/articles/the-difference-between-ids-and-classes/. Change it to a class, and see what happens. (and it'll be standards compliant that way too)

fontophilic

fontophilic, I sure do like being compliant, so thanks for that info. Unfortunately it didn't fix the issue. I'm starting to wonder if it's an issue in the javascript. It's very bizarre, but when the second image comes up it is actually forcing the page to have greater vertical height.

matt_od

well, we ended up going a different route for displaying that information, so this is no longer an issue. thanks for everyone who gave input.

matt_od

The lightbox library you chose is from 2008. As such it may tend to be flaky. One thing is you have some inconsistencies regarding the sizing of the linked-to images. Another is the duplicated id attributes, but that's not a problem. To me, it's unclear from your question whether you want to have all 21 images in the slideshow, or whether each image represents the associated images and you're not meant to be able to get to the other sets from a different set. I cleaned up your html https://gist.github.com/704190, in two versions, regardless, unfortunately before I saw your follow-up. I think the JavaScript is fine, the problem is the library you chose requires you to configure by editing source files, rather than being more configurable, like, say http://fancybox.net/, which is what I like for this task. Best of luck.

artlung

ah, this is a bit late on my part, but thanks artlung!

matt_od

Related Q & A:

Just Added Q & A:

Find solution

For every problem there is a solution! Proved by Solucija.

  • Got an issue and looking for advice?

  • Ask Solucija to search every corner of the Web for help.

  • Get workable solutions and helpful tips in a moment.

Just ask Solucija about an issue you face and immediately get a list of ready solutions, answers and tips from other Internet users. We always provide the most suitable and complete answer to your question at the top, along with a few good alternatives below.