Forum Discussion
Moving Player Controls to the Center
Hello Community, Is there a way to move the player controls to the center after removing the seekbar and play/pause? I found the javascript to hide the play/pause and replay. LaRhonda
Thanks so much for the replies. Sorry for the delay in responding. I've been looking for the community conversation that provided the instructions to remove the "replay" with no luck so far. However, here's the CSS:
- When the timeline starts:
document.getElementById("reset").style.display = "none";
document.getElementById('play-pause').style.display = "none";
Once the play/pause and replay buttons are removed I've like the remaining player controls to be centered or moved to the left if possible.
LaRhonda
Do you need the misc controls? With the following script the misc controls and the prev/next controls are left aligned. The only error that I cannot fix right now is the are on top of each other. You can place the script in a new trigger execute javascript when timeline starts.
Unfortunately, I can't quite solve your problem right now
var interval = setInterval(function () {
var navControls = document.querySelector("#nav-controls");
var miscControls = document.querySelector("#misc-controls");
if (navControls) {
navControls.setAttribute("style", "transform: translate(0px, 0px) !important; left: 0px !important; position: absolute !important;");
console.log("Style applied to #nav-controls");
} else {
console.log("Waiting for #nav-controls...");
}
if (miscControls) {
miscControls.setAttribute("style", "transform: translate(0px, 0px) !important; left: 0px !important; position: absolute !important;");
console.log("Style applied to #misc-controls");
} else {
console.log("Waiting for #misc-controls...");
}
// Stop the interval if both elements have been styled
if (navControls && miscControls) {
clearInterval(interval);
console.log("All styles applied. Interval stopped.");
}
}, 100); // Check every 100ms
