Ultimate Fade-in slideshow (v2.4) - css / html problem?

**MikeUK** · 06-15-2010, 11:41 AM

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

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

3) Describe problem:
I can get the script to work on this page:
http://business-internet.co.uk/jamba...est-fade1.html

... but copying the script onto this page:
http://business-internet.co.uk/jambalaya/index.htm ... and it doesn't work.

I'm trying to get the slide show to display in the right-hand cell of the header row.

I assume this must be a css / html problem as it's the same script on both pages. It does the same thing in FF, IE7 or Chrome.

I'm not a programmer or particularly skilled with css (don't nag me about the tables!) but any advice would be appreciated and stop me tearing my hair out!

Thanks

Mike

Relevant bits of code:

Code:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.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: [250, 90], //width/height of gallery in pixels. Should reflect dimensions of largest image
	imagearray: [
		["pix/cruising.jpg", "", "", "Cruising"],
		["pix/classic-regatta-sml.jpg", "http://en.wikipedia.org/wiki/Cave", "_new", "Classic Regatta 2010"],
		["pix/anitest2.jpg", "", "", "Islands"],
		["pix/classic-regatta-sml.jpg", "", "", "Classic Regatta 2"] //<--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>
</head>

<body>
<table class="tableMain">
  <tr>
    <td colspan="2" class="header">
	<table width="100%">
      <tr>
        <td><h2>Jambalaya - Caribbean Yacht Charter<br>
on a traditional wooden schooner</h2></td>
        <td> <div id="fadeshow1"></div></td>
      </tr>
    </table>

**jscheuer1** · 06-15-2010, 12:31 PM

The path to the script is different/incorrect on the index.htm page:

Code:

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

<script type="text/javascript" src="../Templates/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: [250, 90], //width/height o . . .

On the page where it works you have:

Code:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.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: [250, 90], //width/height o . . .

That's probably it. And that has to be fixed. But there could also be other problems.

**MikeUK** · 06-15-2010, 12:52 PM

Ah!

Thank you John.

That path is added by Dreamweaver when I create a new html file from a template. I'll watch for that in future.

Many thinks for your help.

Cheers

Mike

**MikeUK** · 06-15-2010, 01:25 PM

I can now get the fading images to appear, but they do an odd thing in 2 out of 3 browsers.

http://business-internet.co.uk/jambalaya/

It displays as intended in IE7 but in Frefox 3.6.3 and Chrome the image truncates and leaves a black band on the right-hand side of the image.

The yellow / ochre colour is a background colour in the table cell just so I can see what's going on.

Thanks for any suggestions.

Mike

**azoomer** · 06-15-2010, 03:08 PM

Code:

.header img {
	float: right;
	margin-right:18px;
	}

This part of you css seems to be the bad guy. When deleted all together it looks better in firefox and ie8. Don't know about ie7 though ?

**MikeUK** · 06-15-2010, 07:02 PM

All sorted now - thank you for your help.

Thread: Ultimate Fade-in slideshow (v2.4) - css / html problem?

Thread Tools

Search Thread

Ultimate Fade-in slideshow (v2.4) - css / html problem?

One problem fixed... another appears...

The Following User Says Thank You to azoomer For This Useful Post:

Bookmarks

Bookmarks

Posting Permissions