Forum Discussion

ISD650's avatar
ISD650
Community Member
4 days ago
Solved

Hide play/pause button for one slide but keep seekbar visible

I have one slide with an embedded video that I want the learner to interact with. I want them to click on the video to play the video and not click on the play/pause button on the slide navigation. I...
  • stefanocraba's avatar
    3 days ago

    hi; try this:
    Add a trigger on the slide: Execute JavaScript → When the timeline starts on this slide, and paste this in:

    (function () {
      // Try the likely selectors for the modern player's play/pause button
      var selectors = ['#play-pause', '#play-pause-btn', 'button[data-model-id="play-pause"]'];
      var found = false;
    
      selectors.forEach(function (sel) {
        var el = document.querySelector(sel);
        if (el) {
          el.style.display = 'none';
          found = true;
        }
      });
    
      if (!found) {
        console.warn('Play/pause button not found, check the selector with DevTools');
      }
    })();

    The play/pause button lives in the player, not the slide, so it stays hidden on every following slide too. To bring it back, add a second Execute JavaScript trigger, either on the next slide or on this one when the user clicks Next, with:

    ['#play-pause', '#play-pause-btn', 'button[data-model-id="play-pause"]'].forEach(function (sel) {
      var el = document.querySelector(sel);
      if (el) el.style.display = '';
    });