I am using contentslider.js from DynamicDrive (http://www.dynamicdrive.com/dynamicindex17/featuredcontentslider.htm) for my navigation. Within the DIVs managed by the contentslider I want to have a lightbox-like gallery.
You can view the site at http://dl.dropbox.com/u/198960/portfolio/index.html. Go to the Photography option to see the gallery layout. The seagull at the very top is my test for the Fancybox.
None of the lightbox variations have worked. I'm currently using Fancybox. If I create a page without any other scripts, I can get it to work. But when combined with the other two scripts I'm using for a scroll bar and the content slider, things don't work.
All of the relevant image files, .js files, and .css files are in the top-level directory (and I'm pretty sure all the url paths in the files are correct).
I'm a print designer mucking around with web stuff, so trouble-shooting this isn't really intuitive for me.
Here is my code in the header.
/*********************************************** * Featured Content Slider- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com) * This notice MUST stay intact for legal use * Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more ***********************************************/ $(function() { $('.scroll-pane').jScrollPane({ showArrows:true, autoReinitialise: true }); /* This is basic - uses default settings */ $("a#single_image").fancybox(); /* Using custom settings */ $("a#inline").fancybox({ 'hideOnContentClick': true }); /* Apply fancybox to multiple items */ $("a.group").fancybox({ 'transitionIn' : 'elastic', 'transitionOut' : 'elastic', 'speedIn' : 600, 'speedOut' : 200, 'overlayShow' : false }); });
Manara Design