Forum Discussion

AndreaBorsoi-1d's avatar
AndreaBorsoi-1d
Community Member
4 months ago

JS-hiding the seekbar (but not the reset and play/pause buttons) - What is the "Id" of the seekbar object?

I am trying to hide only the seekbar on a single slide, but I would like to keep the play/pause button and the reset button in view. 

I managed to hide the whole seekbar section (div=playback-controls) with 

document.getElementById("playback-controls").style.display = "none"; 

tied to "when the timeline starts" with a trigger, but I would like only the seekbar to disappear (the reason is that when the user slide it back manually, the animations on layers are not resetting and it is a very complicated slide I do not want to remake - it took me ages to program it due to an absurd storyboard setting the client insisted on (ever been in situations where they want to do the storyboard and end up asking for an almost 'impossible-to-deliver-as-designed' thing?). [later I do trigger again on "when the timeline ends" to style "initial".

Anyway, a good compromise would be to 'kill' the seekline. But I would like to Play/Pause and Reset button to stay.

Only that, whilst the JS above works for the Div, it seems not to work with anything else inside that Div. I think I am not able to pick the right Id of objects in that Div, but I am not so good at HTML and JS so maybe I doing something wrong, or I am not getting something.

Is there  a place where one can see the Id's of all Objects in the MODERN PLAYER? I am using DevTools in Google but all the Id's seems not to work, apart from "playback-controls".

Can anyone help? Really struggling to learn how to do this properly (if possible at all). 

Thanks

A 

storyline 360
  • Jürgen_Schoene_'s avatar
    Jürgen_Schoene_
    Community Member
    4 months ago

    you can hide the seekbar (on timeline starts) with

    document.getElementById("seek").classList.add("hidden");

    and show the seekbar (on timeline ends) with

    document.getElementById("seek").classList.remove("hidden");
    • "hidden" is includes in the default css of storyline
    • "hidden" much better than "display none", if you want to (re)show the hidden element later

    important: if you have the storyline menu active, you has to add "show the seekbar" on the  timeline starts trigger of the Slide Master(s) of your course

    on all used slide master: on timeline starts

    document.getElementById("seek").classList.remove("hidden");

    (If you use the trigger on the Slide Master, there is no need for "show seekbar" on timeline ends)

    result:

    https://360.articulate.com/review/content/d369b79c-1166-4e6c-8eb3-15d578c4adee/review

  • AndreaBorsoi-1d's avatar
    AndreaBorsoi-1d
    Community Member
    4 months ago

    Dear Jürgen,

    Thank you so much!! It worked perfectly. I must work more on my Id-identification skills.... I am indebted. Beer on me when in Nürnberg (which may be soon....planning a sortie to see some museums there) 

    Thank you so so much. 

    Pfiat di aus Oberbayern

    A

Related Content