<div class="range"> <i class="icon ion-volume-low"></i> <input type="range" name="volume"> <i class="icon ion-volume-high"></i> </div>
How to generate html and js code in separate file
The range slider is just a styled html range input. You could either use css
Or look for an angular directive
Change ionic range slider to vertical orientation
Using <input type="range"> in ionic
Thanks it works good
Thanks mhartington, but I am not able to align range slider to extreme left or right side.
I am having google map with ion-content scroll = “false” behind the range slider
Very Nice and Simple but how to get this Range Slider value when we scrolling.?
I’m using latest version of ionic: 3.18.0
But solution with vertical not work well:
You can check it on my gif:
any idea how to solve it?
No, but to let you know the behavior in more detail, what you are seeing is the slider moving vertically while you move the mouse horizontally within the div. I ran into the same thing.
Ionic 3 range component does not work vertically, if you rotate you still have to drag horizontally to change the value