Resolved Multiple Simply Controls galleries won't display [Archive]

View Full Version : Resolved Multiple Simply Controls galleries won't display

mb94

01-26-2009, 02:42 PM

1) Script Title: Simply Controls galleries

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex4/simplegallery.htm

3) Describe problem: I can have on gallery working fine on a page (except an error does appear, saying it can't find the div it should, but it does find the div, so I don't think thats part of the problem). When I try and add a second, a black box appears where the second gallery should be. I had a little bit of a hard time understanding the instructions on how to make multiple, so could someone please help out?
thanks. here is the script I'm using now:

<script type="text/javascript">

var mygallery=new simpleGallery({
wrapperid: "bombardier-f18", //ID of main gallery container,
dimensions: [222, 135], //width/height of gallery in pixels. Should reflect dimensions of the images exactly
imagearray: [
["youtube/b/f18-1.png", "", ""],
["youtube/b/f18-2.png", "", ""],
["youtube/b/f18-3.png", "", ""],
],
autoplay: true,
persist: false,
pause: 2500, //pause between slides (milliseconds)
fadeduration: 500, //transition duration (milliseconds)
oninit:function(){ //event that fires when gallery has initialized/ ready to run
},
onslide:function(curslide, i){ //event that fires after each slide is shown
//curslide: returns DOM reference to current slide's DIV (ie: try alert(curslide.innerHTML)
//i: integer reflecting current image within collection being shown (0=1st image, 1=2nd etc)
}
})

</script>
<script type="text/javascript">

var mygallery2=new simpleGallery({
wrapperid: "bombardier-crj", //ID of main gallery container,
dimensions: [222, 135], //width/height of gallery in pixels. Should reflect dimensions of the images exactly
imagearray: [
["youtube/b/crj-1.png", "", ""],
["youtube/b/crj-2.png", "", ""],
["youtube/b/crj3.png", "", ""],
],
autoplay: true,
persist: false,
pause: 2500, //pause between slides (milliseconds)
fadeduration: 500, //transition duration (milliseconds)
oninit:function(){ //event that fires when gallery has initialized/ ready to run
},
onslide:function(curslide, i){ //event that fires after each slide is shown
//curslide: returns DOM reference to current slide's DIV (ie: try alert(curslide.innerHTML)
//i: integer reflecting current image within collection being shown (0=1st image, 1=2nd etc)
}
})
</script>

jscheuer1

01-26-2009, 02:50 PM

There should be no comma here:

["youtube/b/f18-3.png", "", ""],

or here:

["youtube/b/crj3.png", "", ""],

But that's only a problem for IE. Otherwise the script code looks OK. There is more to this than just the initialization though. If you want more help, we would need to see the page:

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

mb94

01-26-2009, 03:02 PM

http://mm-air.axspace.com/videos.htm
then open the middle tab called "Mitch B"
thanks :)

jscheuer1

01-26-2009, 04:52 PM

Not a problem in IE or Opera. But in Firefox, yes - just what you describe. You should validate your page to HTML 4.01 strict. However, just moving this (highlighted):

. . . ction writecontent(page_request){
if (window.location.href.indexOf("http")==-1 || page_request.status==200)
document.write(page_request.responseText)
}

</script>

<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>M&M Air | Media</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="styles.css" rel="stylesheet" type="text/css" media="screen" />
<style type="text/css">
.style2 {
text-align: center;
} . . .

to it's more or less proper spot in the code, here:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>M&M Air | Media</title>
<meta name="keywords" content="" />
<meta name="description" content="" />

<script type="text/javascript" src="codes/jquery-1.2.6.pack.js"></script>

<style type="text/css">

/*Make sure your page contains a valid doctype at the top*/
#simplegallery1{ //CSS for . . .

will take care of the problem.

mb94

01-26-2009, 09:54 PM

Thanks heaps, It works now :D