flexslider方向箭頭響應

Question

我目前正試圖在全角使用flexslider，並在某個斷點處我希望方向箭頭放在滑塊下面以供移動使用。然後我會在這裏使用文本按鈕來移動滑塊。

我嘗試了一些解決方案。創建了兩個滑塊：一個用於全寬和一個用於移動。當它到達斷點時我隱藏全角，但我似乎無法將這兩個JavaScript組合起來使其工作。

有沒有人之前這樣做可以幫助我？

基本上試圖使用Basic Slider Here作爲我的全屏滑塊，並將其與我的移動滑塊的Basic Slider customDirectionNav結合使用。

這一個用於全寬度

<script type="text/javascript"> 
$(window).load(function() { 
    $('.flexslider').flexslider({ 
    animation: "slide" 
    }); 
}); 
</script> 

這一個用於移動與方向箭頭/文本在底部

<script type="text/javascript"> 
$(window).load(function() { 
    $('.flexslider').flexslider({ 
    animation: "slide", 
    customDirectionNav: $(".custom-navigation a") 
    }); 
}); 
</script> 

Answer 1

你可以使用Modernizr到在不同的剎車點激活腳本的不同實例。

例如：

$("body").each(function() { 
    if (Modernizr.mq('only screen and (min-width: 750px)')) { 
     // For full-width 
     $('.flexslider').flexslider({ 
      animation: "slide" 
     }); 
    } else { 
     // For mobile 
     $('.flexslider').flexslider({ 
      animation: "slide", 
      customDirectionNav: $(".custom-navigation a") 
     }); 
    } 
});