Добрый день всем.
Столкнулся с проблемой, перенося страницу сайта на Wordpress-плагин ion range slider не работает. То есть, поле под него создаётся, но скрипт не срабатывает. Jquery подключена, остальные скрипты работают.
Код подключения jquery и скриптов
<head>
<script src="https://vapemood.ru/wp-content/uploads/calc/jquery.min.js"></script>
<script src="https://vapemood.ru/wp-content/uploads/calc/main.js"></script>
<script src="https://vapemood.ru/wp-content/uploads/calc/save.js"></script>
<script src="https://vapemood.ru/wp-content/uploads/calc/kt-rgb.js"></script>
<!-- Slider -->
<link rel="stylesheet" href="https://vapemood.ru/wp-content/uploads/calc/normalize.min.css" type="text/css" />
<link rel="stylesheet" href="https://vapemood.ru/wp-content/uploads/calc/ion.rangeSlider.css" type="text/css" />
<link rel="stylesheet" href="https://vapemood.ru/wp-content/uploads/calc/ion.rangeSlider.skinNice.css" type="text/css" />
<script src="https://vapemood.ru/wp-content/uploads/calc/ion.rangeSlider.min.js"></script>
</head>
Код вызова скрипта и его параметров
<script>
$(document).ready(function(){
$("#range_1").ionRangeSlider({
min: 3,
max: 8,
from: 3.7,
to: 3.7,
type: 'single',
step: 0.05,
prefix: "Battery: ",
postfix: "v",
gridMargin: 11,
prettify: true,
hasGrid: true, // массив предустановленных значений
onLoad: function (obj) { // callback, вызывается при запуске и обновлении
compute(this);
},
onChange: function (obj) { // callback, вызывается при каждом изменении состояния
compute(this);
},
onFinish: function (obj) { // callback, вызывается один раз в конце использования
compute(this);
}
});
});
</script>
Подумал, может что нибудь не правильно сделал, скачал демо страничку для примера(идёт в архиве вместе с плагином)-она тоже не работает. Помогите подружить скрипт с Wordpress
Ps: вот код демо страницы
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Ion.RangeSlider - test</title>
<link rel="stylesheet" href="https://vapemood.ru/wp-content/uploads/calculator/normalize.min.css" />
<link rel="stylesheet" href="https://vapemood.ru/wp-content/uploads/calculator/ion.rangeSlider.css" />
<link rel="stylesheet" href="https://vapemood.ru/wp-content/uploads/calculator/ion.rangeSlider.skinNice.css" />
</head>
<body>
<!-- Page contents -->
<div style="position: relative; padding: 200px;">
<div>
<input type="text" id="range" value="" name="range" />
</div>
</div>
<!-- All JS -->
<script src="https://vapemood.ru/wp-content/uploads/calculator/ion.rangeSlider.min.js"></script>
</script>
$(function () {
$("#range").ionRangeSlider({
hide_min_max: true,
keyboard: true,
min: 0,
max: 5000,
from: 1000,
to: 4000,
type: 'double',
step: 1,
prefix: "$",
grid: true
});
});
</script>
</body>
</html>