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

View Full Version : 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/dynamicindex14/fadeinslideshow.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?

<!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

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

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

find line and change

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

change there functions

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?