Jssor $ScaleWidth 似乎不起作用

Question

我很挣扎，因为我找不到我的代码有什么问题来使 jssor 滑块响应。下面的代码取自他们网站上的文档，我已经检查了很多次，它并不复杂，只是 API $ScaleWidth() 对页面没有影响，如果你使用它在函数之外。你可以在这里看到它 rickymignanego.com

我重复下面的脚本：

<script>
jQuery(document).ready(function ($) {   
     var _CaptionTransitions = [];       
         _CaptionTransitions["oBelin"] = {
            $Duration:1000,
            $FlyDirection:2,
            $Easing:{$Left:$JssorEasing$.$EaseOutBack},
            $ScaleHorizontal:0.6,
            $Opacity:2
            };        

      var options = {           
           $AutoPlay: false,            
           $CaptionSliderOptions: {                
                   $Class: $JssorCaptionSlider$,
                   $CaptionTransitions: _CaptionTransitions,
                   $PlayInMode: 1,                
                   $PlayOutMode: 3,                         
                   },

            $BulletNavigatorOptions: {                                
                $Class: $JssorBulletNavigator$,                       
                $ChanceToShow: 2,                               
                $AutoCenter: 1,                                 
                $Steps: 1,                                      
                $Lanes: 1,                                      
                $SpacingX: 10,                                  
                $SpacingY: 10,                                  
                $Orientation: 1                                 
            }                      
    };          
    var jssor_slider1 = new $JssorSlider$('home-teaser', options);

    function ScaleSlider() {
        var parentWidth = $('#home-teaser').parent().width();

        if (parentWidth) {
            jssor_slider1.$ScaleWidth(parentWidth);
        }
        else
            window.setTimeout(ScaleSlider, 30);
    }
    //Scale slider after document ready
    ScaleSlider();

    //Scale slider while window load/resize/orientationchange.
    $(window).bind("load", ScaleSlider);
    $(window).bind("resize", ScaleSlider);
    $(window).bind("orientationchange", ScaleSlider);
});         

//jssor_slider1.$ScaleWidth(300);   
</script>

Answer 1

干得好，恭喜！

请完成以下步骤。

$ScaleWidth 是新的API（以前称为$SetScaleWidth），您使用的是旧版本的jssor slider，请下载最新的。

响应式代码不在您的页面中，请在下面添加代码，

//responsive code begin
function ScaleSlider() {
    var parentWidth = $('#home-teaser').parent().width();

    if (parentWidth) {
        jssor_slider1.$ScaleWidth(parentWidth);
    }
    else
        window.setTimeout(ScaleSlider, 30);
}
//Scale slider after document ready
ScaleSlider();

//Scale slider while window load/resize/orientationchange.
$(window).bind("load", ScaleSlider);
$(window).bind("resize", ScaleSlider);
$(window).bind("orientationchange", ScaleSlider);
//responsive code end

Jssor $ScaleWidth 似乎不起作用

Jssor $ScaleWidth seems not working

javascript

jquery

jssor