私の円形のスライダーが表示されません

-1

私は私のアプリに円形のスライダーを含めてみました。ファイルをダウンロードして実装しようとしましたが、スライダが表示されません。彼はどこかでエラーを出すようには見えない。 $('#slider')が呼び出し時にundefinedであるためである私の円形のスライダーが表示されません

<html> 

<head> 
<meta charset="utf-8"> 

<meta name="viewport" content="width=device-width, initial-scale=1"> 
<link rel="stylesheet" type="text/css" href="css/reset.css"> 
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"> 
<link rel="stylesheet" type="text/css" href="css/main.css"> 
<link rel="stylesheet" href="css/circular-slider.min.css"> 

<script type="text/javascript" src="js/jquery-2.1.0.min.js"></script> 
<script type="text/javascript" src="js/script.js"></script> 
<script type="text/javascript" src="js/circular-slider.min.js"></script> 

<script> 
    var circularSlider = $('#slider').CircularSlider({ 
     min : 0, 
     max: 359, 
     value : 10, 
     labelSuffix: "°", 
     slide : function(value) { 
      ui.next().css({'background' : 'linear-gradient(' + value + 
      'deg, white, cornsilk, white)'}); 
     } 
    }); 
</script> 
</head> 


<body> 
<main> 
    <div id="slider"></div> //this is where it should appear 
</main> 
</body> 
</html>

出典

2017-05-17 Arne Berckmans

使用している「円形スライダ」プラグインへのリンクを提供してください。あなたの質問に答えた人は誰でもドキュメントを見ることができますか？ –

。スクリプト全体をdocument.ready callbackにラップするか、<script>タグを</body>タグの末尾の直前に移動してください。これは動作するはず

：

<script> 
    // Wait for the DOM to be ready so the `#slider` element exists at the time of the call 
    $(function() { 
     var circularSlider = $('#slider').CircularSlider({ 
      min : 0, 
      max: 359, 
      value : 10, 
      labelSuffix: "°", 
      slide : function(ui, value) { 
       ui.next().css({'background' : 'linear-gradient(' + value + 
       'deg, white, cornsilk, white)'}); 
      } 
    }); 
</script>

LE： また、この： slide: function(ui, value)： slide : function(value)このなければなりません。

出典

2017-05-17 10:07:06 Cristy

まだ何も表示されません。 ' ' –

' console'にエラーがありますか？また、 'ui'変数はどこで宣言されていますか？私の編集を参照してください。 – Cristy

これは今、ありがとうございます。 –

私の円形のスライダーが表示されません

答えて

関連する問題