What your post asks is not a specific question, but rather an entire project. To aid you in this, I have broken up your question into subproblems, all of which can be resolved with simple googling.
First, set up your slider so that it ranges from 0 to 100 - that will ensure that the user always has 100 options. You can then perform a calculation to adjust that to any range you would like based on your embedded data (information how to get embedded data in JS can be found in this post or on the Qualtrics JS API). For more information on how to scale to any rage, here's a good place to start. This calculation is critical as you will use it later on to set the exact value of the grid lines (i.e. intervals) as well as the displayed value (if you opt to display value).
NB: Unfortunately, you are forced to set up the slider to range from 0-100, as you cannot set up more than 20 grid lines. If you could, you could have just set up 100 grid lines and removed the grid lines values and used labels instead for guidance, but there you go.
Next, start with a slider that has a single grid line in the options. You can now adjust these grid lines to your intervals. Specifically, to get the field where these gridlines are defined, get the ul with class name numbers in your slider question. This could look something like this:
let numbers = document.getElementById('QID1').getElementsByClassName('numbers')[0]
This numbers variable will now contain an HTML element with its children being a list of li elements, with each defining a different interval - calculate those interval however your heart desires and add them to the numbers element on the DOM. Tip: to see how this works, play around by examining the DOM when you vary the number of grid lines. Hint: careful when you set the widths (as this is your property to calculate) - for 2 grid lines or 4, all of the li elements have a width of 50 or 25, respectively, but for 11 grid lines the two li elements with classes first and last have width of 5 and the rest of the in-between li elements have a width of 10.
To customize the number that is shown in those intervals (to however many decimal places you want), adjust the innerHTML of those li elements.
Your next step is to make sure that if you do end up showing the value to the participant, then that value can only be a "legit" value. After all, we set the slider from 0 to 100, but it could be 50 to 250 and it must only show values 50-52-54 etc. To achieve that, find the element that displays the value and overwrite it with your calculation (the current value scaled to your desired range). To find the elements, use something like this:
document.getElementById('QID1~1~toolTipBox')
This will look for question with ID QID1 and then look at the first choice's toolTipBox. Overwrite the contest by change its innerHTML.
Finally, don't forget to adjust your data when you process it later on. After all, you have access to all embedded fields in the data, simply scale those to get the actual values (as the ones you will get will most likely be 0-100, though I am not 100% sure how Qualtrics decides what value to save in the data).
