Javascript 需要离子范围滑块的帮助吗

目前我的滑块最小值和最大值分别为4和100，默认情况下显示网格。我可以在其中添加自定义标签，但无法以更好的方式实现

我想要的是。我目前的代码是：

.showcase__标记{显示：块；位置：绝对；顶部：45px；背景：f00；填充：1px 3px；边框半径：3px；颜色：#fff；左边距：-10px；}

<script>
var min = 4;
var max = 100;

    var marks = [25, 50, 75];

$(document).ready(function() {
            
            <!-- var sliderRangeDifference = 100 - 4; -->
            <!-- var sliderStepThreshold = 110; -->
            <!-- var setLargerMarkers = sliderRangeDifference > sliderStepThreshold;     -->
            
                
            $(".js-range-slider").ionRangeSlider({
                skin: "big",
                min: min,
                max: max,
                grid: true
                <!-- onStart: function(data) {  -->
                 <!-- addMarks(data.slider);  -->
                <!-- }                       -->
                                        
            }); 
 
});

function convertToPercent(num) {
    return (num - min) / (max - min) * 100;
}

function addMarks($slider) {
    var html = '';
    var left = 0;
    var left_p = "";
    var i;

    for (i = 0; i < marks.length; i++) {
        left = convertToPercent(marks[i]);
        left_p = left + "%";
        html += '<span class="showcase__mark" style="left: ' + left_p + '">';
        html += marks[i];
        html += '</span>';
    }

    $slider.append(html);
}

</script>

var min=4；
var max=100；
var评分=[25,50,75]；
$（文档）.ready（函数（）{
$（“.js范围滑块”）.IonRangeSloider({
皮肤：“大”，
敏:敏,，
马克斯：马克斯，
网格：对
}); 
});
函数转换器百分比（num）{
返回值（num-min）/（max-min）*100；
}
函数addMarks（$slider）{
var html=''；
左向量=0；
var left_p=“”；
var i；
对于（i=0；i

最好将屏幕截图添加到问题中，而不是引用可能消失的外部链接。