Help making script work

**Vikings10** · 08-19-2011, 03:07 PM

1) Script Title: Swiss Army Image Slideshow

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

3) Describe problem:
I'm trying to use the "THIRD SLIDESHOW" option to display a few old farm pictures on a web site. I eliminated slideshows ONE and TWO, followed the instructions on the page on where to place the script but all I get is a blank page with a line on top. I made sure the "swissarmy.js"
is located in the same folder. I did change the width and height on each of the pictures.
I'm using Firefox as my internet browser.
I know enough html to create web pages, but still learning the proper use of scripts.

Help?

Here is the html:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Carl Johnson Farm</title>


<style type="text/css">

/* All Styles Optional */

* {
font-family:arial;
font-size:10pt;
}
div#show3 {
background-color:#efefef;
width:140px;
margin:0 auto;
border:1px solid #444444;
}
div#show3 table td, div#show4 table td {
height:24px;
background-image:url('38.gif');
}
div#show4 table td {
background-image:url('40.gif');
}
div#show3 table input,  div#show4 table input {
outline-style:none;
}
</style>

<!--[if IE]>
<style type="text/css">
div#show3 table td, div#show4 table td {
height:21px;
}
</style>
<![endif]-->

<script type="text/javascript">

//If using image buttons as controls, Set image buttons' image preload here true
//(use false for no preloading and for when using no image buttons as controls):
var preload_ctrl_images=true;

//And configure the image buttons' images here:
var previmg='left.gif';
var stopimg='stop.gif';
var playimg='play.gif';
var nextimg='right.gif';

var slides3=[]; //THIRD SLIDESHOW
//configure the below images and descriptions to your own, note optional links, target and window specifications. 

slides3[0] = ["PhotosFarm/01beets.jpg", "Beets" "top=250, left=300, width=576, height=576, location, resizable, scrollbars"];
slides3[1] = ["PhotosFarm/02beetcultivator1933.jpg", "1933 Beet Cultivator""top=250, left=300, width=576, height=576, location, resizable, scrollbars"];
slides3[2] = ["PhotosFarm/03beetsloadedbyhand.jpg", "Beets Loaded by Hand""top=250, left=300, width=576, height=576, location, resizable, scrollbars"];
slides3[4] = ["PhotosFarm/04beetsliftedbyhorse.jpg", "Beets Lifted By Horse""top=250, left=300, width=576, height=576, location, resizable, scrollbars"];
slides3[5] = ["PhotosFarm/05beetloader.jpg", "Beet Loader""top=250, left=300, width=576, height=576, location, resizable, scrollbars"];
slides3[6] = ["PhotosFarm/06beetssnowxroyxhugo.jpg", "Beets in the snow - Walter, unkwn, Roy, unknw, Hugo""top=250, left=300, width=576, height=576, location, resizable, scrollbars"];

//optional properties for these images:
slides3.no_descriptions=1; //use for no descriptions displayed
slides3.pause=1; //use for pause onmouseover
slides3.image_controls=1; //use images for controls
slides3.button_highlight='#cccccc'; //onmouseover background-color for image buttons (requires image_controls=1)
slides3.specs='width=300, height=250' //global specifications for this show's new window(s)
slides3.random=1; //set a random slide sequence on each page load
slides3.manual_start=1; //start show in manual mode (stopped)
//Notes:
//slides#.target will set a target for a slide group, will be overridden by slides#[#][3], if present
//slides#.specs will set new window specifications for a slide group, will be overridden by slides#[#][4], if present
//slides#.fadecolor will set fading images background color, defaults to white
//slides#.no_controls will set a slide show with no controls
//slides#.random will set a random slide sequence on each page load
//slides#.delay=3000 will set miliseconds delay between slides for a given show, may also be set in the call as the last parameter
//slides#.jumpto=1 will display added controls to jump to a particular image by its number
//slides#.no_added_linebreaks=1; use for no added line breaks in formatting of texts and controls
//use below to create a customized onclick event for linked images in a given show:
//slides#.onclick="window.open(this.href,this.target,'top=0, left=0, width='+screen.availWidth+', height='+screen.availHeight);return false;"
</script>
<script src="swissarmy.js" type="text/javascript">
/***********************************************
* Swiss Army Image slide show script  - © John Davenport Scheuer: http://home.comcast.net/~jscheuer1/
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full original source code
***********************************************/
</script>
</head>
<body>
<p>
<script type="text/javascript">
//Notes on Parameters: The only required parameter is the slides_array_name.  If Width is used, so must Height.
//Interval is optional too.  It is always last, either fourth after Width and Height or second after Slides_array_name.
//Usage: new inter_slide(Slides_array_name, Width, Height, Interval)
new inter_slide(slides)
</script>
</p>
<p>
<script type="text/javascript">
new inter_slide(slides2)
</script>
</p>
<p>
<div id="show3"><script type="text/javascript">
new inter_slide(slides3)
</script>
</div>
</p>
</body>
</html>

**jscheuer1** · 08-20-2011, 02:09 AM

This part:

Code:

slides3[0] = ["PhotosFarm/01beets.jpg", "Beets" "top=250, left=300, width=576, height=576, location, resizable, scrollbars"];
slides3[1] = ["PhotosFarm/02beetcultivator1933.jpg", "1933 Beet Cultivator""top=250, left=300, width=576, height=576, location, resizable, scrollbars"];
slides3[2] = ["PhotosFarm/03beetsloadedbyhand.jpg", "Beets Loaded by Hand""top=250, left=300, width=576, height=576, location, resizable, scrollbars"];
slides3[4] = ["PhotosFarm/04beetsliftedbyhorse.jpg", "Beets Lifted By Horse""top=250, left=300, width=576, height=576, location, resizable, scrollbars"];
slides3[5] = ["PhotosFarm/05beetloader.jpg", "Beet Loader""top=250, left=300, width=576, height=576, location, resizable, scrollbars"];
slides3[6] = ["PhotosFarm/06beetssnowxroyxhugo.jpg", "Beets in the snow - Walter, unkwn, Roy, unknw, Hugo""top=250, left=300, width=576, height=576, location, resizable, scrollbars"];

Is wrong. It's missing links and targets. These are required if you want to use the new window specs that you have there. So, since that's missing, I'll just reduce it to images and descriptions. It's also missing a slides3[3] item. These should be in sequence. Give this a shot:

Code:

slides3[0] = ["PhotosFarm/01beets.jpg", "Beets"];
slides3[1] = ["PhotosFarm/02beetcultivator1933.jpg", "1933 Beet Cultivator"];
slides3[2] = ["PhotosFarm/03beetsloadedbyhand.jpg", "Beets Loaded by Hand"];
slides3[3] = ["PhotosFarm/04beetsliftedbyhorse.jpg", "Beets Lifted By Horse"];
slides3[4] = ["PhotosFarm/05beetloader.jpg", "Beet Loader"];
slides3[5] = ["PhotosFarm/06beetssnowxroyxhugo.jpg", "Beets in the snow - Walter, unkwn, Roy, unknw, Hugo"];

If you want to restore the new windows, you need to provide links and targets for each one, example:

Code:

slides3[0] = ["PhotosFarm/01beets.jpg", "Beets", "http://www.google.com/", "_blank", "top=250, left=300, width=576, height=576, location, resizable, scrollbars"];

There could also be other problems. If you want more help:

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

**Vikings10** · 08-20-2011, 12:43 PM

Thanks for the reply John.

Made the changes to the location of the slides as you suggested, still doesn't work.
The web site where I am testing this is located at:
http://www.waynecountry.net/test/

Greatly appreciate any help, I'm fairly good at html but a novice with scripts.
Wayne

**jscheuer1** · 08-20-2011, 04:26 PM

Two problems:

The slides3 array still doesn't follow the required syntax. There's an extra space between the descriptions and the links. That might be harmless. But a real problem is no opening quote delimiter for the targets. Here's a corrected version:

Code:

slides3[0] = ["farmphotos/01beets.jpg", "Beets", "http://www.waynecountry.net/test/farmphotos/", "_blank", "top=250, left=300, width=576, height=576, location, resizable, scrollbars"]; 
slides3[1] = ["farmphotos/02beetcultivator1933.jpg", "1933 Beet Cultivator", "http://www.waynecountry.net/test/farmphotos/", "_blank", "top=250, left=300, width=576, height=576, location, resizable, scrollbars"]; 
slides3[2] = ["farmphotos/03beetsloadedbyhand.jpg", "Beets Loaded by Hand", "http://www.waynecountry.net/test/farmphotos/", "_blank", "top=250, left=300, width=576, height=576, location, resizable, scrollbars"]; 
slides3[3] = ["farmphotos/04beetsliftedbyhorse.jpg", "Beets Lifted By Horse", "http://www.waynecountry.net/test/farmphotos/", "_blank", "top=250, left=300, width=576, height=576, location, resizable, scrollbars"]; 
slides3[4] = ["farmphotos/05beetloader.jpg", "Beet Loader", "http://www.waynecountry.net/test/farmphotos/", "_blank", "top=250, left=300, width=576, height=576, location, resizable, scrollbars"]; 
slides3[5] = ["farmphotos/06beetssnowxroyxhugo.jpg", "Beets in the snow - Walter, unkwn, Roy, unkwn, Hugo", "http://www.waynecountry.net/test/farmphotos/", "_blank", "top=250, left=300, width=576, height=576, location, resizable, scrollbars"];

The copy of swissarmy.js on the server is corrupted. Line breaks have been added in places that break the script. Possibly other changes have crept in. Download a fresh copy and replace the existing one with it. Don't open it in any editor.

I'm a little concerned about #2 as, if you hadn't opened it in any editor, it might be something about how you upload it to the server that's doing that. Best to use ftp. That way nothing bad should happen to it.

Note: After changes like these, always clear the browser cache and refresh the page before testing.

**Vikings10** · 08-20-2011, 10:35 PM

Thanks again John.

I guess it can make a difference, I should have told you I'm doing this on a Mac G4, running Tiger (OS X 10.4.11) and I use Fetch to upload to the internet. I believe Fetch is ftp. I use Firefox as my browser.

I made the changes as you wrote them and it now works as you can see on:

http://www.waynecountry.net/test/

With Test 3 at least you can click and view each of the photos, but the controls are different than the THIRD SLIDESHOW on:

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

On that site, the third slideshow, on mouseover pauses the photo until you move the mouse off the picture. Also, the controls at the bottom of the slideshow are different from what is on my web site. How did I mess that up?

By the way, I guess I messed up the swissarmy.js by clicking on that. It then opens up in a page with the code, I copied and pasted it in Word and saved it as a text file. This time I clicked and held on it and did a download, which saves it correctly.

The 3 tests on my web site were just changes from the first attempt to the second and finally the third with your changes. Just my way of trying to figure out what I was doing wrong. I just want Test 3 to work right.

Thanks again for your help!!
Wayne

**jscheuer1** · 08-21-2011, 01:27 AM

You need the control images:

(attempt to show the image)

or:

http://www.dynamicdrive.com/dynamici...sarmy/left.gif (the image address)

or:

http://www.dynamicdrive.com/dynamici...sarmy/play.gif

or:

http://www.dynamicdrive.com/dynamici...sarmy/stop.gif

or:

http://www.dynamicdrive.com/dynamici...army/right.gif

Put them in the same folder as the page.

As before, clear the browser cache and refresh the page before testing the results.

**Vikings10** · 08-21-2011, 02:39 AM

Thanks John, that puts the proper controls in, including the hold picture with mouseover.

It looks great and I can use it this way but I would like the names to show for each photo, why aren't they coming up?

Wayne

**jscheuer1** · 08-21-2011, 05:44 AM

Get rid of the highlighted line:

Code:

 . . . ght=576, location, resizable, scrollbars"]; 
slides3[5] = ["farmphotos/06beetssnowxroyxhugo.jpg", "Beets in the snow - Walter, unkwn, Roy, unkwn, Hugo", "http://www.waynecountry.net/test/farmphotos/", "_blank", "top=250, left=300, width=576, height=576, location, resizable, scrollbars"];


//optional properties for these images:
slides3.no_descriptions=1; //use for no descriptions displayed
slides3.pause=1; //use for pause onmouseover
slides3.image_controls=1; //use images for controls
slides3.button_highlight='#cccccc'; //onmo . . .

**Vikings10** · 08-21-2011, 11:00 AM

That does it, works perfect, problems solved, lessons learned!!

Thanks for all your help John, greatly appreciate it.

Wayne

**Vikings10** · 08-21-2011, 03:11 PM

Well it worked great for the test:

http://waynecountry.net/test/

Now when I apply the format to all of the photos it won't work. Is there a limit to the number of photos you can use? Here's the link to all the photos:

http://waynecountry.net/test2/

I have quadruple checked to make sure the format is the same as what you showed me. Frustrated.

Wayne

Thread: Help making script work

Thread Tools

Search Thread

Help making script work

Bookmarks

Bookmarks

Posting Permissions