javascript - 如何在 RoyalSlider 中设置中心图像宽度？

Question

我有this page用RoyalSlider在可见的附近图像模式下。

我想将中心图像的大小更改为 1050x514 以重现在 this page 上看到的 slider .

这些是我对 slider 的设置:

var si = $('#gallery-1').royalSlider({
   addActiveClass: true,
   imageScaleMode: 'fill',
   arrowsNav: false,
   controlNavigation: 'bullets',
   autoScaleSlider: true, 
   autoScaleSliderWidth: 940,     
   autoScaleSliderHeight: 460,
   loop: true,
   fadeinLoadedSlide: false,
   globalCaption: true,
   keyboardNavEnabled: true,
   globalCaptionInside: false,
   slidesSpacing:0,
   controlsInside : false,

   visibleNearby: {
     enabled: true,
     centerArea: 0.5708,
     center: true,
     breakpoint: 704,
     breakpointCenterArea: 1,
     navigateByCenterClick: true
   }
 }).data('royalSlider');

我似乎找不到为每种分辨率获得固定宽度的方法。

我正在使用 RoyalSlider，因为它具有附近可见模式、拖动滚动条以及显示视频的可能性。我愿意尝试具有相同功能的不同脚本或 wordpress 插件(甚至高级版)，因此愿意接受建议。

Answer 1

您可以使用类 .rsActiveSlide 来定位中心图像。

即:

.visibleNearby .rsActiveSlide img{
    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -o-transform: scale(1.5);
    transform: scale(1.5);
}