My guess is something in you eval() statement is not sitting well with IE. It's hard to debug in this case without examining each of the strings you're feeding into eval() line by line. Regardless though, you should avoid using eval() altogether (as it's inefficient), and use use a function that in turn calls new simpleGallery() with the desired image array to show instead. Here's a fully working example:
Code:
<script type="text/javascript" src="simplegallery.js">
/***********************************************
* Simple Controls Gallery- (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 imgcollection1=[
["http://i26.tinypic.com/11l7ls0.jpg", "http://en.wikipedia.org/wiki/Swimming_pool", "_new"],
["http://i29.tinypic.com/xp3hns.jpg", "http://en.wikipedia.org/wiki/Cave", ""],
["http://i30.tinypic.com/531q3n.jpg", "", ""],
["http://i31.tinypic.com/119w28m.jpg", "", ""]
]
var imgcollection2=[
["http://i31.tinypic.com/119w28m.jpg", "", ""],
["http://i30.tinypic.com/531q3n.jpg", "", ""],
["http://i29.tinypic.com/xp3hns.jpg", "http://en.wikipedia.org/wiki/Cave", ""],
["http://i26.tinypic.com/11l7ls0.jpg", "http://en.wikipedia.org/wiki/Swimming_pool", "_new"]
]
function showgallery(imgcollection){
mygallery=new simpleGallery({
wrapperid: "simplegallery1", //ID of main gallery container,
dimensions: [250, 180], //width/height of gallery in pixels. Should reflect dimensions of the images exactly
imagearray: imgcollection,
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)
}
})
}
showgallery(imgcollection1) //show imgcollection1 to start when page loads
</script>
<body>
<div id="simplegallery1"></div>
<a href="javascript:showgallery(imgcollection1)">Show collection 1</a> <a href="javascript:showgallery(imgcollection2)">Show collection 2</a>
As you can see, all you need to do is first define individual arrays containing the desired images to show within that collection, then feed it into function showgallery(). This function calls new SimpleGallery() with all the settings predefined except the image collection to show.
Simple Controls Gallery and IE7
Reply With Quote
Bookmarks