Question

我正在尝试将Royal Slider集成到我的网站中。但是，当滑块位于我页面上的选项卡中时，第一张幻灯片出现问题。

例如，您可以在http://christierichards.co.uk/slidertest/newtemplatefix.php看到滑块工作正常（目前还没有样式）。

在此页http://christierichards.co.uk/slidertest/newtemplate.php上点击之前和之后（这是我希望滑块出现的标签）时，第一张幻灯片不显示，直到您点击标签2然后高度似乎出现。< / p>

我已设法在选项卡中修复它，但这只是通过在.rsOverflow上添加固定高度。我无法使用固定高度，因为我需要自动高度功能来为客户添加自己的照片。所以我需要一种不同的方式。

某处必须有一段冲突的代码但是我很难过！任何帮助将不胜感激。

由于

Answer 1

滑块正在初始化，同时它隐藏在选项卡后面。因此，它无法计算其高度和宽度，并且是不可见的。当您更改为滑块中的下一个项目时，将重新计算高度和宽度，这就是您可以再次看到它的原因。

您可以将初始高度添加到.rsOverflow，或者在单击选项卡时重新初始化滑块，并使内容可见。

例如：

var sliderInitialised = false;

$j( "#tabs" ).tabs({
  activate: function( event, ui ) {
     // Check the activated tab, is the one that contains the slider

     if(!sliderInitialised) {
         // Initialise slider ...

         sliderInitialised = true; 
     }
  }
});

或者，可以在隐藏所有选项卡内容之前初始化滑块。

第一张幻灯片没有在标签中的jQuery Royal Slider中显示

1 个答案: