Hello,

I am using slider revolution inside a couple of the Visual Composer tabs. However when selecting the tab, the slider is all skewed and won’t play at first. See next post for example screenshots and links.

I read that this is due to a resizing problem with revolution slider (I read this on the codecanyon comments but the post is 3 years a go):

“You need to use the API’s to stop the slider if the tab is closed, and to start the slider if the tab is opened. Also after opening the tab (after the tab animation) please trigger the Browser Resize event via jQuery so the slider recognise he need to redraw itself.”

Their fix was to:

“So you will need to make a bit of code which checks the class of your tab. Most tab adds a “opened” or “active” class if it is activated. Let say your tab called ”.tab1” than you do something like this:

jQuery('.tab1').click(function() {
    if (jQuery(this).hasClass('active') {
          setTimeout(function() {
                 revapi4.resume();
                 jQuery(window).trigger("resize");
          },500);
     } else {
         revapi4.revpause()
     }
}

The problem with this is the tab that is clicked on has no class or id. Even though it says the ID is 4ferr5443 is in visual composer, its not the id for the tab. So I suspect this is why it isn’t working. I tried adding a class to the tab shortcode but it didn’t work.

Code I have added:

<script type=”text/javascript”>
jQuery(‘#4ferr5443’).click(function(){
if (jQuery(this).hasClass(‘active’) {
setTimeout(function() {
revapi6.resume();
jQuery(window).trigger(“resize”);
},200);
} else {
revapi6.revpause()
}
}
</script>

Is there any way to get this working in tabs?

Thanks in advance for your help!