Fade In Slideshow won't "let go" of my image.

**davebrockett** · 11-01-2010, 04:49 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: Just using 2 images - Got it to stop on image I want - but now want to use that image (mainface2.jpg) as an image map to further navigate the site. Tried inserting image map code in variety of configurations - no luck.
I Love the Ultimate Fade In Slideshow! And want to use it! Any Ideas?

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<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: [700, 650], //width/height of gallery in pixels. Should reflect dimensions of largest image
	imagearray: [
		["IMAGES/mainface1.jpg"],
		["IMAGES/mainface2.jpg"]
 //<--no trailing comma after very last image element!
	],
	displaymode: {type:'auto', pause:1000, cycles:1, wraparound:false},
	persist: false, //remember last viewed slide and recall within same session?
	fadeduration: 500, //transition duration (milliseconds)
	descreveal: "none",
	togglerid: ""
})



</script>

<link rel="stylesheet" type="text/css" href="divcenter.css" />

</head>

<body bgcolor="#FFFFFF" leftmargin="0" topmargin="10">

<div id="content">

<div id="fadeshow1"></div>

</div>
</body>
</html>

**vwphillips** · 11-01-2010, 10:54 AM

modified initialisation

Code:

var mygallery=new fadeSlideShow({
	wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
	dimensions: [700, 650], //width/height of gallery in pixels. Should reflect dimensions of largest image
	imagearray: [
		["http://www.vicsjavascripts.org.uk/StdImages/Egypt5.jpg"],
		["http://www.vicsjavascripts.org.uk/StdImages/Egypt6.jpg"]
 //<--no trailing comma after very last image element!
	],
    imagemaps:[
     '',
     'map1'
    ],
	displaymode: {type:'auto', pause:1000, cycles:1, wraparound:false},
	persist: false, //remember last viewed slide and recall within same session?
	fadeduration: 500, //transition duration (milliseconds)
	descreveal: "none",
	togglerid: ""
})

the map

Code:

<map name="map1" >
  <area shape="rect" alt="" coords="0,0,100,100"  onmouseover="alert();" />
</map>

find line and change

Code:

		var fullhtml=fadeSlideShow.routines.getFullHTML(setting.imagearray,setting.imagemaps) //get full HTML of entire slideshow

change there functions

Code:

	getSlideHTML:function(imgelement,map){
		var layerHTML=(imgelement[1])? '<a href="'+imgelement[1]+'" target="'+imgelement[2]+'">\n' : '' //hyperlink slide?
		layerHTML+='<img src="'+imgelement[0]+'" style="border-width:0;" usemap="#'+map+'" />\n'
		layerHTML+=(imgelement[1])? '</a>\n' : ''
		return layerHTML //return HTML for this layer
	},

	getFullHTML:function(imagearray,mapary){
		var preloadhtml=''
		for (var i=0; i<imagearray.length; i++)
			preloadhtml+=this.getSlideHTML(imagearray[i],mapary[i])
		return preloadhtml
	},

**davebrockett** · 11-01-2010, 05:47 PM

Thanks SO much vwphillips
It worked perfectly!

**davebrockett** · 11-01-2010, 09:24 PM

Hi Back again.
after you helped me I was so excited I started dancing.
Was checking site function in different browsers...
Works like I hoped in Firefox, but my client views all in Safari
The rollover in Safari was causing a small window to appear
that stated that the website www.glenheroy.com was "undefined".
This window pops up everytime I roll over a link.
(by the way, when I hit enter and the little annoying window goes away
the script/code works as advertised)

Went to my local Apple store and asked WTF
They suggested I make sure this script has the "Universal Web Kit"
so it is not just Mozilla (Firefox) specific

Make any sense? - Got any suggestions?

Thread: Fade In Slideshow won't "let go" of my image.

Thread Tools

Search Thread

Fade In Slideshow won't "let go" of my image.

Thanks SO much worked perfectly!

Won't work cross browser (safari, IE)

Bookmarks

Bookmarks

Posting Permissions