diff --git a/ui/controls.js b/ui/controls.js
index ee96b93f38..8f36c4e9c5 100644
--- a/ui/controls.js
+++ b/ui/controls.js
@@ -148,7 +148,7 @@ shaka.ui.Controls = class extends shaka.util.FakeEventTarget {
      */
     this.timeAndSeekRangeTimer_ = new shaka.util.Timer(() => {
       // Suppress timer-based updates if the controls are hidden.
-      if (this.isOpaque_()) {
+      if (this.isOpaque()) {
         this.updateTimeAndSeekRange_();
       }
     });
@@ -1040,7 +1040,7 @@ shaka.ui.Controls = class extends shaka.util.FakeEventTarget {
     // open.
     this.hideSettingsMenusTimer_.stop();
 
-    if (!this.isOpaque_()) {
+    if (!this.isOpaque()) {
       // Only update the time and seek range on mouse movement if it's the very
       // first movement and we're about to show the controls.  Otherwise, the
       // seek bar will be updated much more rapidly during mouse movement.  Do
@@ -1137,7 +1137,7 @@ shaka.ui.Controls = class extends shaka.util.FakeEventTarget {
       return;
     }
 
-    if (this.isOpaque_()) {
+    if (this.isOpaque()) {
       this.lastTouchEventTime_ = Date.now();
       // The controls are showing.
       // Let this event continue and become a click.
@@ -1268,9 +1268,9 @@ shaka.ui.Controls = class extends shaka.util.FakeEventTarget {
 
   /**
    * @return {boolean}
-   * @private
+   * @export
    */
-  isOpaque_() {
+  isOpaque() {
     if (!this.enabled_) {
       return false;
     }
@@ -1287,7 +1287,7 @@ shaka.ui.Controls = class extends shaka.util.FakeEventTarget {
    */
   seek_(currentTime, event) {
     this.video_.currentTime = currentTime;
-    if (this.isOpaque_()) {
+    if (this.isOpaque()) {
       // Only update the time and seek range if it's visible.
       this.updateTimeAndSeekRange_();
     }
diff --git a/ui/range_element.js b/ui/range_element.js
index f86a1e1665..ba9c85ae6b 100644
--- a/ui/range_element.js
+++ b/ui/range_element.js
@@ -64,14 +64,18 @@ shaka.ui.RangeElement = class extends shaka.ui.Element {
     this.parent.appendChild(this.container);
 
     this.eventManager.listen(this.bar, 'mousedown', () => {
-      this.isChanging_ = true;
-      this.onChangeStart();
+      if (this.controls.isOpaque()) {
+        this.isChanging_ = true;
+        this.onChangeStart();
+      }
     });
 
     this.eventManager.listen(this.bar, 'touchstart', (e) => {
-      this.isChanging_ = true;
-      this.setBarValueForTouch_(e);
-      this.onChangeStart();
+      if (this.controls.isOpaque()) {
+        this.isChanging_ = true;
+        this.setBarValueForTouch_(e);
+        this.onChangeStart();
+      }
     });
 
     this.eventManager.listen(this.bar, 'input', () => {
@@ -79,19 +83,25 @@ shaka.ui.RangeElement = class extends shaka.ui.Element {
     });
 
     this.eventManager.listen(this.bar, 'touchmove', (e) => {
-      this.setBarValueForTouch_(e);
-      this.onChange();
+      if (this.isChanging_) {
+        this.setBarValueForTouch_(e);
+        this.onChange();
+      }
     });
 
     this.eventManager.listen(this.bar, 'touchend', (e) => {
-      this.isChanging_ = false;
-      this.setBarValueForTouch_(e);
-      this.onChangeEnd();
+      if (this.isChanging_) {
+        this.isChanging_ = false;
+        this.setBarValueForTouch_(e);
+        this.onChangeEnd();
+      }
     });
 
     this.eventManager.listen(this.bar, 'mouseup', () => {
-      this.isChanging_ = false;
-      this.onChangeEnd();
+      if (this.isChanging_) {
+        this.isChanging_ = false;
+        this.onChangeEnd();
+      }
     });
   }