0

Hello DaniWebers!

I'm absolutely shocking when it comes to JavaScript/JQuery and have run into an occurance when I would like to use it. Now before you slap me on the wrist I DO intend to learn JS in 2014 (Scouts honour!).

I am using this slider: JQuery - Snap To Increments

HTML

<div id="slider-snap-inc" class="slider bg-green"></div>
<div class="slider-value">
    Days: <span id="slider-snap-inc-days"></span> | 
    Cost: <span id="slider-snap-inc-amount"></span> |
    Savings: <span id="slider-snap-inc-savings"></span>
</div>

JS:

// snap inc
$("#slider-snap-inc").slider({
    value: 50,
    min: 50,
    max: 1300,
    step: 50,
    slide: function (event, ui) {
        $("#slider-snap-inc-amount").text("$" + ui.value);
    }
});

The above works great and the value shows in increments just as it should.. but what I would like to do is add another two calculations:

1. Days
The number days selected for premium account upgrade.

2. Savings
The money saved by purchasing more days in one transaction.

A table with the data I need to present, just so you understand a little bit easier: Data I'm Using

How does one go about adding more calculations and outputs to the same slider? I've played around but can only make one of the three work at any one time. Thanks for any assistance.

2
Contributors
2
Replies
22
Views
4 Years
Discussion Span
Last Post by mmcdonald
0

How does one go about adding more calculations and outputs to the same slider

Just add more code to the slide event. If you have three, make sure they have unique id's.

0

Yeah I think I've decided to hire a dev for this little snippet :3 but thanks

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.