Test images work - My images don't work?

[tenmeg]

1) Script Title: :: Ultimate Fade-in slideshow (v2.1)

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

3) Describe problem: Test images in script works but when I add my own image path(s) to the html script the program does not work? Your instructions say "(check inside fadeslideshow.js to ensure that the paths to these 3 test images are correct) I can not find anywhere in fadeslideshow.js where you can change image path(s). Script test image path: http://i26.tinypic.com/11l7ls0.jpg.

Thanks for any help - TENMEG

[Nile]

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

Please include your code so that we can take a look at it, we can't do much without it. When you do post your code remember to use [code] tags. That includes [ html ], [ code ], and [ php ].

Please do the above before further assistance.

[tenmeg]

1) Script Title: :: Ultimate Fade-in slideshow (v2.1)

2) My Test Web Page - http://www.ask-mr-waldo/slideshow.html

3) 3) Describe problem: Test images in script work but when I add my own image path(s) to the html script the program does not work? The instructions say "(check inside "fadeslideshow.js" to ensure that the paths to these 3 test images are correct). I can not find anywhere in "fadeslideshow.js" where you can change the test image path(s)?


Test script Code attached below

[code]
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

<script type="text/javascript" src="fadeslideshow.js">

/***********************************************
* Ultimate Fade In Slideshow v2.0- (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
***********************************************/

</script>

<script type="text/javascript">

var mygallery=new fadeSlideShow({
wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
dimensions: [147, 147], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
["http://i26.tinypic.com/11l7ls0.jpg", "", "", "Nothing beats relaxing next to the pool when the weather is hot."],
["http://i29.tinypic.com/xp3hns.jpg", "http://en.wikipedia.org/wiki/Cave", "_new", "Some day I'd like to explore these caves!"],
["http://i30.tinypic.com/531q3n.jpg"],
["http://i31.tinypic.com/119w28m.jpg", "", "", "What a beautiful scene with everything changing colors."] //<--no trailing comma after very last image element!
],
displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "ondemand",
togglerid: ""
})

</script>

[tenmeg]

The problem is, I can't find anywhere in the JS script where you can change the test images path. The instruction say to check the JS to make sure the paths are correct. If you wanted a copy of the java script code it is too large for your message system. If you click the 'view source under view' on the test slideshow web page you can view the JS text. Tenmeg

[jscheuer1]

No. It says (on the demo page):

(check inside fadeslideshow.js to ensure that the paths to these 3 images are correct)

There is no mention of the word "test" on the demo page. This refers to the 3 helper images:

• x.png
• restore.png
• loading.png

Which are set here (highlighted) in the fadeslideshow.js file:

/* Ultimate Fade-in slideshow (v2.1)
* Last updated: Sept 10th, 2009. This notice must stay intact for usage 
* Author: Dynamic Drive at http://www.dynamicdrive.com/
* Visit http://www.dynamicdrive.com/ for full source code
*/

//Oct 6th, 09' (v2.1): Adds option to randomize display order of images, via new option displaymode.randomize

var fadeSlideShow_descpanel={
	controls: [['x.png',7,7], ['restore.png',10,11], ['loading.gif',54,55]], //full URL and dimensions of close, restore, and loading images
	fontStyle: 'normal 11px Verdana', //font style for text descriptions
	slidespeed: 200 //speed of description panel animation (in millisec)
}

You probably still have a problem with the actual images for the show. The paths for these however are not in the fadeslideshow.js file. They are in the on page portion of the script (replace the highlighted with the paths and filenames of your own images):

var mygallery=new fadeSlideShow({
	wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
	dimensions: [250, 180], //width/height of gallery in pixels. Should reflect dimensions of largest image
	imagearray: [
		["http://i26.tinypic.com/11l7ls0.jpg", "", "", "Nothing beats relaxing next to the pool when the weather is hot."],
		["http://i29.tinypic.com/xp3hns.jpg", "http://en.wikipedia.org/wiki/Cave", "_new", "Some day I'd like to explore these caves!"],
		["http://i30.tinypic.com/531q3n.jpg"],
		["http://i31.tinypic.com/119w28m.jpg", "", "", "What a beautiful scene with everything changing colors."] //<--no trailing comma after very last image element!
	],
	displaymode: {type:'auto', pause:2500, cycles:0, wraparound:false},
	persist: false, //remember last viewed slide and recall within same session?
	fadeduration: 500, //transition duration (milliseconds)
	descreveal: "ondemand",
	togglerid: ""
})

If your images are in the same folder as your page, you only need their filenames in those highlighted fields.

If you want more help, please post a link to a page on your site that shows the script using your images (or at least trying to use your images).

[tenmeg]

Hi John - Yea it was my mistake - I left off the .com on my original image path in the html script - I didn't notice it and went looking for another solution - saw the 'check inside fadeslideshow.js to ensure that the paths to these 3 images are correct' instructions and went looking for a solution in that direction - I thought the reference to the 3 images was referring to the script's test images - I managed to turn something simple into something complicated - I finally caught my error later but thanks for the detailed explanation - George/TENMEG

[tenmeg]

Hi John - yes there is one other question - In the 'imagearray' section there is something called 'optional-linktarget' - the example shows the following input: '_new' - does the 'optional_linktarget' work the same as a html link target - I tried using a html link target code but that does not seem to work - I want the image be clickable and jump to a specific text on the same page where the Ultimate Fade-in slideshow (v2.1) is located?

George/TENMEG

[jscheuer1]

What you want is not a target, it's a hash, so called because it uses the hash (#) mark. A target specifies the name/type of window that the link will be launched in. When it's for the current window, it should be "_self" (the default), so usually just leaving it empty is just as good. A hash specifies the name of a named anchor to jump to, and is part of the URL, sometimes (like when you are jumping on the same page) it's the entire URL.

So for example to jump to:

<a name="specialText"></a>
<div>This is some special text here.</div>

on the same page, you would make the entry in the image array look like so (use your own image):

["img01_o.jpg", "#specialText", "", ""],

[tenmeg]

Hi John - thanks for explaining & illustrating how to implement the 'anchor' that I wanted - although I wrongly called it 'link_target" - it is a question of language but I'm JAVA deficient and have trouble sometime writing basic HTML That is the reason I wanted this program because it had the "anchor" capability where I could link my images to text on the same page. - Thanks again. . . George/TENMEG

PS - I never knew or had ever heard what the # symbol was called. Learn something every day!

[tenmeg]

Hi John - I was scrolling through the 'new' scripts/programs and saw a scrolling text/image program but it did not have a mouse over anchor capability I'm seeking - is there such a animal in DD. George/TENMEG