I have an image with an inline opacity set like so...
<img id="theImage" style="opacity: 0.54;" src="...source..." class="gray-scale-img profileImage img-responsive"/>
I'm using IonRangeSlider to set a new value of the opacity but the issue is that if I go above 0.54 on my range slider the opacity does nothing. It will adjust fine from 0.00 to 0.54, but if I go above this, it just remains at 0.54 and will not get any brighter.
$("#theImage").css({ opacity: opacity });
IonRangeSlider
$("#formElement").ionRangeSlider({
min: 0,
max: 100,
onChange: function(data) {
var val = data.from;
if (val < 100) {
if (val < 10) {
var opacity = "0.0" + val;
} else {
var opacity = "0." + val;
}
} else {
var opacity = "1.0"
}
$("#theImage").css({
opacity: opacity
});
},
onFinish: function() {
...
}
});
Thanks.