This site uses cookies and similar technologies.

If you don't change browser settings, you agree to it.

I understand
41 Posts
3 years ago

I have a strange behavior with a list templated with slicked list. 

 I have listed contents per month of creation. I used slicked list template to manage this list in order to open modal window and use Bootstrap 3 modal version. Into this modal window, I have a contents slideshow, which is a list of contents managed with slicked list too. It works nicely, except if the number of contents is less than 4. For 1, 2 or 3 contents, all contents overlap. 

I tried to see what happens whith Firebug, but as soon as I click on Firebug, the contents move to their correct place. I attach the screenshot to show the result. Does anyone have any idea of what might happen ? 

Thanks in advance

Here is the code created by the template for the list items :

<script type="text/javascript"> JCck.Core.baseURI = "/auxmarins2"; jQuery(document).ready(function(){jQuery('.my-slick-class').slick({ autoplay: true, prevArrow: 'Previous', nextArrow: 'Next', dotsClass: 'slick-dots', mobileFirst: true, responsive: [{breakpoint: 768, settings: {slidesToShow: 2,}},{breakpoint: 992, settings: {slidesToShow: 3,}},], swipeToSlide: true, }); }); </script>
Get a VIP membership
1272 Posts
3 years ago
Level 1

Hi Mlep

I have had a quick play and I think it has to do with Slick calculating position pre modal opening, and then recalculating after modal is open.

Might need to add some js to resolve


Carousel doesn't seem to behave if placed within a modal window #1085

Possible remedies:


Bootstrap 3 + slick.js Multiple Modal window

Unfortunately I am not able to check further as going away today....


1272 Posts
3 years ago
Level 2

Oh, and also

The same slick is being used repeatedly with the same 'slick-class' for different slides.

Not sure if it's possible to do it like that.

They would all have to have different slick classes....


1272 Posts
3 years ago
Level 3

... So maybe enure that 'this slick.js 'turned 'off' and that youadd the necessary code to your joomla templates js file so that it is only loadad once so to speak

1272 Posts
3 years ago
Level 4


Here is a way to dynamically apply to slick to your list results...


Get a Book for SEBLOD