Hello,
I am using quicktabs to display a slideshow in one of the tabs. I have the issue when a slideshow is not on the first active tab, that slideshow will not be displayed at all when I click on its tab.
I have found out that it was caused by the functions outerWidth and outerHeight in the function buildOptions of the file jquery.cycle.all.min.js which computes the width and the height of the container of the slides. Because my slideshow was in an hidden tab (display='none'), the outerWidth and outerHeight always returned 0; which caused the slideshow to never be displayed.
To fix that, I temporarily display the tab during the search of the max height and width of the slides and then re-hide it at the end. It may not be a clean solution, but it works.
for(var i=0;i<els.length;i++){
var $e=$(els[i]);
++ var changeVisible = false;
++ if($e.outerWidth() == 0 || $e.outerHeight() == 0){
++ $e.parent().parent().parent().parent().parent().parent().parent().parent().parent()[0].style.display = "block";
++ changeVisible = true;
++ }
var e=$e[0],w=$e.outerWidth(),h=$e.outerHeight();
if(!w){w=e.offsetWidth;}
if(!h){h=e.offsetHeight;}
maxw=w>maxw?w:maxw;
maxh=h>maxh?h:maxh;
++ if(changeVisible){
++ $e.parent().parent().parent().parent().parent().parent().parent().parent().parent()[0].style.display = "";
++ }
}
if(maxw>0&&maxh>0){
$cont.css({width:maxw+"px",height:maxh+"px"});
}
Comments
Comment #1
ppblaauw commentedThanks for posting this workaround solution:
Could you also try to put: {"containerResize": false} in the custom jquery cycle plugin settings in the configuration page of the ddblock module and give a width and height to the container in CSS.
Maybe this will also solve the issue (the cycle plugin would not use the container resize code).
Comment #2
hinanui commentedYour solution works if you know in advance the length of the content in each slide.
In my case, the content is dynamic and so I can't fix the height of the container. It has to be resized. That's why I had to change the code like that.
Comment #3
ppblaauw commentedGreat to hear the solution with the {"containerResize": false} works, this is what most users can use to solve the issue, because most users will have a slideshow with a fixed width and height on their Drupal site.
When they don't have a fixed width and/or height with their dynamic display block slideshow, they can use your solution.
Set status to fixed.