Need help with slideshow, please.

[CountryNaturals]

I found a great free utility to use for slideshows on my sites. It works great unless I add links to the photos. Even then, the links work, but when it comes back, the slideshow starts over. I thought if I could open the links in a separate window, it might solve the problem, but I seem to be doing something wrong with the syntax. I used target="_blank" after the URL in the link, but that just made it mad so I took them out. Here's the page:

http://countrynaturals.com/epp/smolthop.htm#

I know the photo quality is bad and my designs are lousy, too, but I have the new Dreamweaver on order. Then I'm going to redo everything. In the meantime, this is just a test. I have loads of applications for a slideshow so I need to get this figured out.

TIA for any help you can offer.

Suz

[kos]

Here ya go, ma'am!

The javascript:

    <script type="text/javascript">

/***********************************************
* DHTML slideshow script-  © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice must stay intact for legal use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

var photos = [], photosLink = [], which = 0;

//define images. You can have as many as you want:
photos[0] = "epp/slideshow/bfly.jpg";
photos[1] = "epp/slideshow/cntry.jpg";
photos[2] = "epp/slideshow/credit.jpg";
photos[3] = "epp/slideshow/diy.jpg";
photos[4] = "epp/slideshow/easyknit.jpg";
photos[5] = "epp/slideshow/redding.jpg";
photos[6] = "epp/slideshow/expo.jpg";
photos[7] = "epp/slideshow/end.jpg";

//Specify whether images should be linked or not (1=linked)
var linkornot = 1;

//Set corresponding URLs for above images. Define ONLY if variable linkornot equals "1"
photosLink[0] = "http://butterfly-moth.com";
photosLink[1] = "http://countrynaturals.com";
photosLink[2] = "http://build-smart-credit.com"; 
photosLink[3] = "http://diy-how-to.com";
photosLink[4] = "http://easy-knit-crochet.com";
photosLink[5] = "http://affordableredding.com";
photosLink[6] = "http://loveyourpetexpo.com";
photosLink[7] = "http://countrynaturals.com/epp/smolthop.htm";

//do NOT edit pass this line

var preloadedImages = [];
for (i = 0; i < photos.length; i++)
{
    preloadedImages[i] = new Image;
    preloadedImages[i].src = photos[i];
}

function applyEffect()
{
    if (document.all && photoslider.filters)
    {
        photoslider.filters.revealTrans.Transition = Math.floor(Math.random()*23);
        photoslider.filters.revealTrans.stop();
        photoslider.filters.revealTrans.apply();
    }
}

function playEffect()
{
    if (document.all && photoslider.filters)
        photoslider.filters.revealTrans.play();
}

function keepTrack()
{
    window.status="Image " + (which + 1) + " of " + photos.length;
}

function backward()
{
    if (which > 0)
    {
        which--;
        applyEffect();
        document.images.photoslider.src = photos[which];
        playEffect();
        keepTrack();
    }
}

function forward()
{
    if (which < photos.length - 1)
    {
        which++;
        applyEffect();
        document.images.photoslider.src = photos[which];
        playEffect();
        keepTrack();
    }
}

function transport()
{
    if (linkornot==1)
    {
        target = photosLink[which];
        var theLink = document.getElementById("newLink");
            theLink.setAttribute('target', "_blank");
            theLink.setAttribute('href', target);
    }
}

    </script>

The HTML:

Replace this:

<td width="100%" colspan="2" height="22"> 
                <center>
                  <script>
if (linkornot==1)
document.write('<a href="javascript:transport()">')
document.write('<img src="'+photos[0]+'" name="photoslider" style="filter:revealTrans(duration=2,transition=23)" border=0>')
if (linkornot==1)
document.write('</a>')
</script>
                </center>
              </td>

With this:

                                        <td width="100%" colspan="2" height="22">
                                            <center>
                                                <a id="newLink" href="" onclick="transport();">

                                                    <script type="text/javascript">

document.write('<img src="'+photos[0]+'" name="photoslider" style="filter:revealTrans(duration=2,transition=23); border: none 0px;">');

                                                    </script>

                                                </a>
                                            </center>
                                        </td>

Note:
-- I've reformatted the javascript and camelized the variables and the function names as they should have been declared by the author in the first place.

-- As you can see here:

<a id="newLink" href="" onclick="transport();">

the href="" is empty. You may leave it empty or you may add the "#" sign. I'll leave this to your will (it will work anyway), but you should not remove it because it will not work anymore.


hope you'll like it!

[CountryNaturals]

WOW! Thank you. I somehow missed your reply. I'm over here begging for more help and stumbled on this by accident. I'll copy this all down and work on it today. Again, thanks for taking the time to work on this for me.

Suz

[kos]

It was my pleasure!