0

ここからブートストラップ スライダーを使用しようとしています: https://github.com/seiyria/bootstrap-slider。ただし、スライダーを初期化できません。私のコード スニペットは次のようになります。

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link href="css/bootstrap-switch.min.css" rel="stylesheet"/>
    <link href="https://raw.githack.com/seiyria/bootstrap-slider/master/css/bootstrap-slider.css" rel="stylesheet" /> 
    <link rel='stylesheet' href='css/jquery-ui.css'>
    <link rel='stylesheet' href='css/ol.css'>
    <script src="js/jquery-ui.js"></script>
    <script src="http://openlayers.org/en/v3.9.0/build/ol.js"></script>
    <script src="js/jquery.ui.widget.js"></script>
    <script src="js/jquery.iframe-transport.js"></script>
    <script src="js/jquery.fileupload.js"></script>
    <script src="https://raw.githack.com/seiyria/bootstrap-slider/master/js/bootstrap-slider.js"></script>    
    <script src="js/bootstrap-switch.min.js"></script>

</head>

<body>
        <input style='width:80px;' class='opacity' type='text' value='' data-slider-min='0' data-slider-max='1' data-slider-step='0.1' data-slider-tooltip='hide'>

    <script type="text/javascript">
        $('input.opacity').slider();
    </script>

</body>

これにより、図に示すように単純な入力タイプが得られます

ここに画像の説明を入力

次に、私がする場合:

$('input.opacity').bootstrapSlider();

これにより、次のようなエラーが発生します。

ここに画像の説明を入力

ここで何が欠けていますか?

4

1 に答える 1