我正在制作一个带有1到X张幻灯片的全宽滑块,一次显示4张幻灯片。它在大屏幕或中型屏幕上看起来非常棒,但响应式脚本会在较小的屏幕上大幅减小滑块的宽度,以便仍然包含所有4个幻灯片。有没有办法只在较小的屏幕上调整Cols或SlideWidth,这样就不会大幅调整幻灯片的大小?
$(document).ready(function(){
var jssor_1_options = {
$AutoPlay: true,
$AutoPlaySteps: 4,
$FillMode: 5,
$Cols: 4,
$SlideWidth: 313,
$SlideSpacing: 15,
$SlideDuration: 800,
$SlideEasing: $Jease$.$OutQuint,
$ArrowNavigatorOptions: {
$Class: $JssorArrowNavigator$,
$Steps: 1,
},
};
var jssor_1_slider = new $JssorSlider$("jssor_1", jssor_1_options);
function ScaleSlider() {
var refSize = jssor_1_slider.$Elmt.parentNode.clientWidth;
if (refSize) {
refSize = Math.min(refSize, 1920);
jssor_1_slider.$ScaleWidth(refSize);
}
else {
window.setTimeout(ScaleSlider, 30);
}
}
ScaleSlider();
$(window).bind("load", ScaleSlider);
$(window).bind("resize", ScaleSlider);
$(window).bind("orientationchange", ScaleSlider);
});