Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • January 28, 2016 at 3:12 am #573424
    ellamac

    Hi, I have inserted shortcodes for a portfolio grid into tabs, with each tab holding a different category.
    When you click on a different tab, the spacing between the portfolio items is off – clipping off the items in the right hand column, and creating an unusually large gap between items.
    If you resize the window with this tab open, or refresh the page on this tab ID, then the portfolio grid displays correctly – but doesn’t seem to refresh the other tabs. It is happening in all browsers that I tested, PC and MAC.

    It seems like the calculation for the left margin of the grid items is out, but I can’t see how to rectify it.

    (I have also included a masonry grid shortcode, to see if this made a difference but it does not.)

    Appreciate any help I can get!

    January 29, 2016 at 8:26 am #574362
    Ismael

    Hi ellamac!

    Thank you for using Enfold.

    Please add this in the functions.php file:

    add_action('wp_footer', 'ava_auto_resize');
function ava_auto_resize(){
?>
<script>
(function($){
	var int = '';
	$( "#top .tabcontainer" ).bind({
	mouseenter: function() {
		int = window.setInterval(function(event){
			$(window).trigger('resize');
			console.log('resize');
		}, 1000);
	},
	mouseleave: function() {
		setTimeout(function() {
			clearInterval(int);
		}, 1000);
	}
});
})(jQuery);
</script>
<?php
}

    Best regards,
    Ismael

    January 31, 2016 at 11:29 pm #575457
    ellamac

    Thank you so much – that’s the one! Great quick support.

    February 1, 2016 at 5:07 am #575526
    Ismael

    Hi!

    Great! Glad it worked. :)

    Regards,
    Ismael

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Portfolio Grid within Tabs – cropped’ is closed to new replies.