diff --git a/content/patterns/slider/examples/js/slider-rating.js b/content/patterns/slider/examples/js/slider-rating.js index afa1b2fce2..de36c781bd 100644 --- a/content/patterns/slider/examples/js/slider-rating.js +++ b/content/patterns/slider/examples/js/slider-rating.js @@ -224,9 +224,9 @@ class RatingSlider { onRailClick(event) { const x = this.getSVGPoint(event).x; const diffX = x - this.railOffset; - const fract = + const rating = 0.5 + (diffX * (this.valueMax - this.valueMin)) / this.railWidth; - const value = Math.round(fract); + const value = Math.round(rating); this.moveSliderTo(value); diff --git a/content/patterns/slider/examples/slider-rating.html b/content/patterns/slider/examples/slider-rating.html index a28c8a7b47..5845aaad9a 100644 --- a/content/patterns/slider/examples/slider-rating.html +++ b/content/patterns/slider/examples/slider-rating.html @@ -44,7 +44,7 @@
Similar examples include:
aria-orientation
to specify vertical orientation and aria-valuetext
to communicate unit of measure for a temperature input.aria-valuetext
to communicate current and maximum values of time in media to make the values easy to understand for assistive technology users by converting the total number of seconds to minutes and seconds.