Support

Support is part of Event Gallery Extended.

Please get a subscription if you need support. Feel free to use the ticket system or the contact form for reporting defects or pre-sale questions. Make sure you're logged in in order to be able to create a new ticket.

For general information you can also jump to the manual.

Subscribe now!

#1750 Event gallery in tabs

Posted in ‘Event Gallery Extended’
This is a public ticket

Everybody will be able to see its contents. Do not include usernames, passwords or any other sensitive information.

Latest post by mat321 on Thursday, 08 October 2015 11:44 UTC

Tuesday, 06 October 2015 10:38 UTC

mat321
 Hi,

Just a litle bug/question : on my site i try to put the gallery in tabs using the content fonction and here the results :

http://www.poncetloc.com/v1/index.php?option=com_content&view=article&id=62&Itemid=138

As you can see, i put exactly the same code in the tabs name "photo" and below the tabs and i don't know why the display is not great in the tabs, the gallery display only a big photo an few small photo with the same size and i want the display was the same that below.

Do you why and what can i do ?

Thanks

Tuesday, 06 October 2015 10:54 UTC

sbluege
Not sure how you tab code works, but I guess there is a problem because the tab content area does not have an initial size. This size is necessary to calculate the image layout. If you resize the browser, the layout is recalculated and works then. Can you try to give those tab content areas an initial width please?

Tuesday, 06 October 2015 13:03 UTC

mat321
Hi,

i try to put a size tab of 1200px but still the same... but strange due to it works well when resize....

Let me know if there is an other tweak !!!

Thanks a lot

Tuesday, 06 October 2015 13:48 UTC

sbluege
This helps: 

.eventgallery-imagelist {
  width: 1200px;
}


the problem is that initially tab4 is display:none; so the inner content does not know the width. Thus it can't calculate the layout. Setting a fixed width is not a very good solution. Maybe one can tween the tab behavior a bit? But that's nothing I can do here.

Wednesday, 07 October 2015 15:45 UTC

mat321
Hi,

Thanks, not really good... what i have to ask the developper of the tabs to make it works ?

Thanks

Wednesday, 07 October 2015 15:57 UTC

sbluege
You need to find out if there is a way to avoid "display:none" for the tab content area in order to let the javascript running inside this area determine the correct width.

Wednesday, 07 October 2015 17:04 UTC

mat321
Ok i will ask.

Other idea : isn't possible by javascript to catch the wide of the first tab ans send it ? i suppose it's stock in a variable due to it work when resizing so so we can give the wide to the varaible ?

I'm not developper but suppose it's possible

Thanks !!!

Wednesday, 07 October 2015 18:13 UTC

sbluege
I can't adjust the code of Event Gallery. The only thing I can do is this: 

<script>
   		
jQuery( document ).ready(function() {
	
	jQuery("#navtab4:hidden").each(function(index, item){
		var $item = jQuery(item);
		$item.css('visibility','hidden');
		$item.css('display', 'block');
		jQuery('#navtab1').css('display','none');
		jQuery(window).trigger('resize');
		setTimeout(function(){
			$item.css('display', '');
			$item.css('visibility','');
			jQuery('#navtab1').css('display','');
		}, 500);
	});

});
</script>


This code renders the 4th tab before the first one appears. This allows the Event Gallery script to calculate the layout since the tab is not longer set to display:none. Add this code to your templates JS file. It'll only work on the page you send as an example.

Thursday, 08 October 2015 09:20 UTC

mat321
Hi,

thanks. it works but only for one tab, in other tab we have the same problem.

I just able to take the width in a javascript varaible using this code :

<script>
<!--


var hauteura = document.getElementById("tz-component").offsetWidth;
//-->
document.write("test" + hauteura);
</script>

So i have the width in a variable name : hauteura

Can you tell me how i can send it to event gallery script ?
What is the variable name or of the wide in event gallery please ?

thanks

Thursday, 08 October 2015 11:22 UTC

sbluege
You can't send anything to the event gallery script. It detects those things itself. In addition I pretty sure the width you determine is wrong and the layout will not look as expected.

But there is another thing you can try. If you switch the tab just call "jQuery(window).trigger('resize');" after the content is visible. This will trigger the layout process again. Which script do you use for the tab navigation? Do you have somebody who can adjust this script?

Thursday, 08 October 2015 11:26 UTC

sbluege
Well... try this one:

jQuery('a[data-toggle="tab"]').on('click', function (e) {
  jQuery(window).trigger('resize');
});

Thursday, 08 October 2015 11:44 UTC

mat321
it works cool !!