Lightbox Image Viewer 2 (wants to discard thumbnails and have one main photo)

[jeanine]

1) Script Title: lightbox

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...tbox/index.htm

3) Describe problem: I don't want ALL thumbnails displayed, just ONE main photo that users can click on to open lightbox slideshow.

[jscheuer1]

The script linked to in your post will not make anything like a slide show regardless of whether or not there are one or more thumbnails.

I think you might mean:

http://www.dynamicdrive.com/dynamici...box2/index.htm

There are better scripts for this. But a slide show of sorts (it would be manually driven by the user) can be made using this script's gallery syntax (from the demo page):

<a href="images/image-1.jpg" rel="lightbox[roadtrip]">image #1</a>
<a href="images/image-2.jpg" rel="lightbox[roadtrip]">image #2</a>
<a href="images/image-3.jpg" rel="lightbox[roadtrip]">image #3</a>

If you want thumbnails, replace image #1, image #2, image #3 with image tags. If you want only one thumbnail, do it like so:

<a href="images/image-1.jpg" rel="lightbox[roadtrip]"><img src="images/image-1-small.jpg" alt=""></a>
<a href="images/image-2.jpg" rel="lightbox[roadtrip]"></a>
<a href="images/image-3.jpg" rel="lightbox[roadtrip]"></a>

[jeanine]

okay so I have this code:

<link media=screen href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/engine/css/lightbox.css" type=text/css rel=stylesheet>
<script src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/engine/js/prototype.js" type=text/javascript></script>

<script src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/engine/js/scriptaculous.js?load=effects,builder" type=text/javascript></script>

<script src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/engine/js/lightbox.js" type=text/javascript></script>

<div class=gallery>


<a title="Member Holiday Celebration" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/holiday1.jpg" rel=lightbox[sample]><img src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/holiday1.jpg" width="90" height="60" border="0"></a>

...and it goes on with more photos included in the info between <a and </a>


where would I add the one you gave me:

<a href="images/image-1.jpg" rel="lightbox[roadtrip]"><img src="images/image-1-small.jpg" alt=""></a>
<a href="images/image-2.jpg" rel="lightbox[roadtrip]"></a>
<a href="images/image-3.jpg" rel="lightbox[roadtrip]"></a>

[jscheuer1]

You don't add it anywhere, it was just an example. What you should do is remove all of the other image tags so that all that remains is:

<a title="Member Holiday Celebration" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/holiday1.jpg" rel=lightbox[sample]><img src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/holiday1.jpg" width="90" height="60" border="0"></a>

followed by all of the other link tags. You didn't show what they look like, but I imagine the next one looks something like so:

<a title="Member Holiday Celebration" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/holiday2.jpg" rel=lightbox[sample]><img src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/holiday2.jpg" width="90" height="60" border="0"></a>

It should now look like:

<a title="Member Holiday Celebration" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/holiday2.jpg" rel=lightbox[sample]></a>

and so on for the rest of them. Only the first one in the rel="lightbox[sample]" series should have a thumbnail, the rest will be unseen 'empty' links.

[jeanine]

Okay I'm trying to get it to work... I'll be on here all day until this is fixed

[jscheuer1]

If you want more help:

Please post a link to the page on your site that contains the problematic code so we can check it out.

[jeanine]

Thank you so much by the way I appreciate every bit of your help!

The site is www.Marshlandingcc.com

It's a member login only, so use this name Clubhouse and password MLCC86, so you can at least look at the pages I'm having trouble with.

Lightbox is being used on these pages:
membership, golf operations, weddings & banquets, swim and the Member Holiday Celebration photo page (link on home)

If worst comes to worst, I just need a code that will be a slideshow or a gallery type (like http://www.dynamicdrive.com/dynamici...photoalbum.htm ) demo #1


Below is the standard code I'm using, of course changing the image file names to correlate with what page it's on. As I said before I want to make just one photo appear and once the member clicks on that photo, the lightbox controllable slideshow will show all images.


<link rel=stylesheet type=text/css href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/engine/css/lightbox.css" media=screen>
<script type=text/javascript src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/engine/js/prototype.js"></script>

<script type=text/javascript src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/engine/js/scriptaculous.js?load=effects,builder"></script>

<script type=text/javascript src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/engine/js/lightbox.js"></script>

<div class=gallery><a title="Marsh Landing Country Club Wedding" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddingset014.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddingset014.jpg" width=120 height=90></a> <a title="Marsh Landing Country Club Wedding" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/wedding099.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/wedding099.jpg" width=120 height=90></a> <a title="Marsh Landing Country Club Wedding" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/wedding007.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/wedding007.jpg" width=120 height=90></a> <a title="Marsh Landing Country Club Wedding" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/wedding008.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/wedding008.jpg" width=120 height=90></a> <a title="Marsh Landing Country Club Wedding" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/wedding022.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/wedding022.jpg" width=120 height=90></a> <a title="Marsh Landing Country Club Wedding" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/wedding100.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/wedding100.jpg" width=120 height=90></a> <a title="Marsh Landing Country Club Wedding" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/wedding102.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/wedding102.jpg" width=120 height=90></a> <a title="Marsh Landing Country Club Wedding" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/vase.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/vase.jpg" width=120 height=90></a> <a title="Marsh Landing Country Club Wedding" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/banquet.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/banquet.jpg" width=120 height=90></a> <a title="Marsh Landing Country Club Wedding" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/wedding80.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/wedding80.jpg" width=120 height=90></a> <a title=" Marsh Landing Country Club Wedding " href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings12.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings12.jpg" width=120 height=90></a> <a title=" Marsh Landing Country Club Wedding " href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings11.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings11.jpg" width=120 height=90></a> <a title=" Marsh Landing Country Club Wedding " href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings5.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings5.jpg" width=120 height=90></a> <a title=" Marsh Landing Country Club Wedding " href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings9.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings9.jpg" width=120 height=90></a> <a title=" Marsh Landing Country Club Wedding " href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings8.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings8.jpg" width=120 height=90></a> <a title=" Marsh Landing Country Club Wedding " href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings7.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings7.jpg" width=120 height=90></a> <a title=" Marsh Landing Country Club Wedding " href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings6.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings6.jpg" width=120 height=90></a> <a title=" Marsh Landing Country Club Wedding " href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings10.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings10.jpg" width=120 height=90></a> <a title=" Marsh Landing Country Club Wedding " href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings4.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings4.jpg" width=120 height=90></a> <a title=" Marsh Landing Country Club Wedding " href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings3.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings3.jpg" width=120 height=90></a> <a title=" Marsh Landing Country Club Wedding " href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings2.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings2.jpg" width=120 height=90></a> <a title=" Marsh Landing Country Club Wedding " href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings1.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/imageviewer/weddings1.jpg" width=120 height=90></a> </div></font></font></font></font></td></tr></tbody>
<p></p>

[jscheuer1]

Well, for example, on /tour/tours.cfm replace:

<a title="Marsh Landing Country Club Golf" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/1st9andwine.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/1st9andwine.jpg" width=120 height=90></a> <a title="1st Flight Low Net Winners" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/1stflight.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/1stflight.jpg" width=120 height=90></a> <a title="Frank Jurney, Low Gross Champion, Super Senior Division" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/Frankjurney.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/Frankjurney.jpg" width=120 height=90></a> <a title="George Erickson, Low Gross Champion, Senior Division" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/georgeerickson.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/georgeerickson.jpg" width=120 height=90></a> <a title="Overall Low Gross Champions" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/overall.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/overall.jpg" width=120 height=90></a> <a title="Rick Catlett, Low Net Champion, Senior Division" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/rickcatlet.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/rickcatlet.jpg" width=120 height=90></a> <a title="Chester Stokes, Low Net Champion, Super Senior Division" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/stokessrdiv.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/stokessrdiv.jpg" width=120 height=90></a> <a title="Team USA Ryder Cup Champions" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/teamusachampions.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/teamusachampions.jpg" width=120 height=90></a>

with:

<a title="Marsh Landing Country Club Golf" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/1st9andwine.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/1st9andwine.jpg" width=120 height=90></a><a title="1st Flight Low Net Winners" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/1stflight.jpg" rel=lightbox[sample]></a><a title="Frank Jurney, Low Gross Champion, Super Senior Division" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/Frankjurney.jpg" rel=lightbox[sample]></a><a title="George Erickson, Low Gross Champion, Senior Division" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/georgeerickson.jpg" rel=lightbox[sample]></a><a title="Overall Low Gross Champions" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/overall.jpg" rel=lightbox[sample]></a><a title="Rick Catlett, Low Net Champion, Senior Division" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/rickcatlet.jpg" rel=lightbox[sample]></a><a title="Chester Stokes, Low Net Champion, Super Senior Division" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/stokessrdiv.jpg" rel=lightbox[sample]></a><a title="Team USA Ryder Cup Champions" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/teamusachampions.jpg" rel=lightbox[sample]></a>

[jeanine]

I thought it worked a minute ago, but now when the picture is clicked on the slideshow doesn't start it only shows the image in the window. eeshk! here's the code verbatim:


<a title="Marsh Landing Country Club Golf" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/1st9andwine.jpg" rel=lightbox[sample]><img border=0 src="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/1st9andwine.jpg" width=120 height=90></a><a title="1st Flight Low Net Winners" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/1stflight.jpg" rel=lightbox[sample]></a><a title="Frank Jurney, Low Gross Champion, Super Senior Division" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/Frankjurney.jpg" rel=lightbox[sample]></a><a title="George Erickson, Low Gross Champion, Senior Division" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/georgeerickson.jpg" rel=lightbox[sample]></a><a title="Overall Low Gross Champions" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/overall.jpg" rel=lightbox[sample]></a><a title="Rick Catlett, Low Net Champion, Senior Division" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/rickcatlet.jpg" rel=lightbox[sample]></a><a title="Chester Stokes, Low Net Champion, Super Senior Division" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/stokessrdiv.jpg" rel=lightbox[sample]></a><a title="Team USA Ryder Cup Champions" href="/Clubs/MarshLandingCC_FL/Uploaded/FacilityPics/golftourney/teamusachampions.jpg" rel=lightbox[sample]></a>

[jscheuer1]

The code from your post is correct and works here. Did you change anything else about the page? What browser are you using?