2017-02-06 7 views
0

ロードされません。http://seiyria.com/bootstrap-slider/ブートストラップスライダーは、私はここから作業する例#2を取得しようとしている

<!DOCTYPE html> 
<html> 

<head> 
<link rel="stylesheet" href="css/bootstrap.css"> 
<link rel="stylesheet" href="css/bootstrap-slider.css"> 
<link rel="stylesheet" href="css/jquery-ui.css"> 
<script src="js/jquery-3.1.1.min.js"></script> 
<script src="js/jquery-ui-1.12.1.js"></script> 
<script src="js/bootstrap.js"></script> 
<script src="js/bootstrap-slider.js"></script> 

</head> 
<body> 
Filter by price interval: <b>€ 10</b> <input id="ex2" type="text" class="span2" value="" data-slider-min="10" data-slider-max="1000" data-slider-step="5" data-slider-value="[250,450]"/> <b>€ 1000</b> 


</body> 
</html> 
<script> 
$("#ex2").slider({}); 
</script> 

は何が起こることだけではなく、スライダの小さなテキストボックスを作成します。どうすれば適切に表示させることができますか?

+0

コンソールを確認してください。何かエラーが見えますか? – fernando

+0

http://i.imgur.com/mflut3R.png – crystyxn

答えて

2

<link rel="stylesheet" href="css/jquery-ui.css"><script src="js/jquery-ui-1.12.1.js"></script>は、ブートストラップスライダーの動作を無効にしています。

<!DOCTYPE html> 
<html> 

<head> 
<link rel="stylesheet" href="css/bootstrap.css"> 
<link rel="stylesheet" href="css/bootstrap-slider.css"> 

<script src="js/jquery-3.1.1.min.js"></script> 
<script src="js/bootstrap.js"></script> 
<script src="js/bootstrap-slider.js"></script> 

</head> 
<body> 
Filter by price interval: <b>€ 10</b> <input id="ex2" type="text" class="span2" value="" data-slider-min="10" data-slider-max="1000" data-slider-step="5" data-slider-value="[250,450]"/> <b>€ 1000</b> 


</body> 
</html> 
<script> 
$("#ex2").slider({}); 
</script> 
関連する問題