PDA

View Full Version : Resolved Multiple Instances Simple Gallery



422
04-26-2011, 11:41 PM
1) Script Title: SimpleGallery

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

3) Describe problem:

Thanks to nles help yesterday we got the simple gallery working, this script really fits the purpose we need.

However, here is a issue we have.

We cannot load the script var mygallery etc etc in the head, as we have the following scenario.

We have a Feature slider, which contains information and the simple gallery on each slider.

Each Feature Slider has a unique ID.
Each simple gallery has a UNIQUE ID, including simplegallery and mygallery id changes such as simplegallery1 - mygallery1 -> simplegallery2 - mygallery2 etc etc

We change these using php, based on the feature slider id reference. So if we are on feature slider 1 we add the suffix 1 to simplegallery and mygallery, likeweise if we are on feature slider 5 ... they are simpelgallery5 and mygallery5

Everything works fine, until we look at subsequent Feature Slides, so number 1 works fine.

But number 2 etc doesnt display the images.

We have the script like this : ( example for gallery 2 )



<script type="text/javascript">
var mygallery2=new simpleGallery({
wrapperid: "simplegallery2",
dimensions: [190, 143],
imagearray: [
["http://somesite.com.au/public/images/listings/1.jpg"],
["http://somesite.com.au/public/images/listings/2.jpg"],
["http://somesite.com.au/public/images/listings/3.jpg"],
["http://somesite.com.au/public/images/listings/4.jpg"]
],
autoplay: [false, 2500, 2],
persist: true,
fadeduration: 500,
oninit:function(){
document.getElementById(this.setting.wrapperid + "_max_page").innerHTML = this.setting.imagearray.length;
},
onslide:function(curslide, i){
document.getElementById(this.setting.wrapperid + "_cur_page").innerHTML = i+1;
}
})
</script>

<div class="featured-result-details">
<!--image slider-->
<div class="featured-result-details-left">
<div id="simplegallery2"></div>
<br />
<div class="items-in-featured-scroll-photo">
<a href="javascript:mygallery2.navigate('prev')"><div class="prev-button left back-left" ></div></a>
<div class="listing-count left back-left">Photo <span id="simplegallery2_cur_page">0</span> of <span id="simplegallery2_max_page">0</span></div>

<a href="javascript:mygallery2.navigate('next')"><div class="next-button left back-left" ></div></a>
</div>
</div>
<!--//image slider-->



As you see the php functionality ( this is client side version shown above ) works absolutely fine.

And gallery1 for example is same as above code wise, but with suffix 1 inplace of 2
It works fine and images display perfectly.

But gallery 2 images etc do not work ... in fact neither do the cur_page and max_page counters.

I am perplexed as to why this is.

If we have the above in the head it all works, for obvious reasons, we could be displaying 5+ galleries on one page with 12+ images in each gallery, so would rather not have all this loading in the head.

Am I doing something incredibly stupidly wrong, or have I overlooked something sinister in our code lol/.

Any help appreciated.

Cheers 422

ddadmin
04-27-2011, 05:36 PM
It's hard to wrap my head around the set up right now without a working example. Do you have a URL to what you have so far?

422
04-27-2011, 10:44 PM
Hi DDadmin.

Thanks for the response,

Sorry the URL is blind at the moment during development. We in the end opted for another gallery slider for the snippet we wanted, and it is all working now.

We tried all conceivable workarounds for this, and now have a solid solution.

Cheers 422.