проценты noUislider на базе - PullRequest
Новая
       40

проценты noUislider на базе

0 голосов
/ 22 января 2020

У меня есть этот дизайн noUislider , я хочу при обновлении изменить проценты в зависимости от положения ручки. Может кто-нибудь, пожалуйста, помогите с этим? Я занимался этим последние 2 дня, пытаясь найти способ считать значения в процентах. У меня есть цена initialPrice, которая максимальна для слайдера. Я хочу, чтобы после перемещения ручки вычислили два процента на основе этого значения initialPrice.

https://i.stack.imgur.com/dDZ9l.png

это мой javascript : 

    var financialCalculator = document.getElementById('financial_calculator');
    noUiSlider.create(financialCalculator, {
        start: 400000,
        range: {
            'min': [0],
            'max': initialPrice
        },
        connect: [false, true],
        format: wNumb({
            decimals: 0,
            thousand: '\'',
            edit: function (value) {
                return value
            }
        })
    });
    var mortageTotal = document.getElementById('mortage');

    var equityTotal = document.getElementById('equity');

    financialCalculator.noUiSlider.on('update', function (values, handle) {

    });

это мой html: 

                        <div class="custom-range-financial">
                            <div class="d-flex w-100 position-absolute slider-overlay">
                                <div class="d-flex w-100 slider-elem-wrapper">
                                    <span class=" align-self-center bold text-center white" id="mortage"
                                        style="width: 40%;">
                                        40%</span>
                                    <span class="align-self-center bold text-center white" id="equity"
                                        style="width: 60%;">60%</span>
                                </div>
                            </div>
                            <div class="violet-slider" id="financial_calculator">
                                <span class="position-absolute plus">+</span>
                            </div>
                        </div>
...