2 Cycle Galleries, One Page

Have a question or a suggestion about a 3rd party addon module or plugin?
Let us know here.
Post Reply
oakstreet
New Member
New Member
Posts: 5
Joined: Fri Aug 09, 2019 7:28 pm

2 Cycle Galleries, One Page

Post by oakstreet »

I am trying to do a before and after of 2 cycle galleries on one page.
Here is what I have tried:
1. added the two galleries {Gallery dir='416before'}{Gallery dir='416after'} using same cycle code
2. added the two galleries {Gallery dir='416before'}{Gallery dir='416after'} 2 separate templates, omitting the jquery in the send cycle code
3. adding the two galleries in a cms template to separate, still the after gallery wont rotate...like the javascript is broken.
for the second cycle template I removed the last code section. Suggestions?

Code: Select all

{* note that the thumbs are shown in stead of the original images, just to make sure all images are of the same size due to the crop image-resize option *}
<div id="slides" style=" margin:auto;width:315px; height:420px;">
{foreach from=$images item=image}
	{if !$image->isdir}
		<img src="{$image->thumb}" alt="{$image->titlename}" />
	{/if}
{/foreach}
</div>

Code: Select all

/* height and width should be the same as the thumbnail sizes */
#slides {
  max-width: 315px;
  height: 475px;
-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
}

Code: Select all

<__script__ type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></__script>
<__script__ type="text/javascript" src="{$gallery_module_root}/templates/cycle/jquery.cycle.lite.js"></__script>

<__script__ type="text/javascript">
$(document).ready(function() {
	$('#slides').cycle({ 
		delay:  2000, 
		speed: 500,
		before: onBefore
	});

	function onBefore() {
		$('#caption').html(this.alt);
	};
});
Attachments
help.jpg
User avatar
DIGI3
Dev Team Member
Dev Team Member
Posts: 1037
Joined: Wed Feb 25, 2009 4:25 am
Location: Victoria, BC

Re: 2 Cycle Galleries, One Page

Post by DIGI3 »

Looks like you'd need to give each gallery a unique ID, then either call the script twice or have it apply to both ID's. CSS requires that all IDs be unique, unlike classes.
Not getting the answer you need? CMSMS support options
oakstreet
New Member
New Member
Posts: 5
Joined: Fri Aug 09, 2019 7:28 pm

Re: 2 Cycle Galleries, One Page

Post by oakstreet »

That is exactly what I wound up doing and it fixed it. Thank you!
Post Reply

Return to “Modules/Add-Ons”