Search code examples
javascripthtmlhtml5-audiomoodleaudiojs

How to make Audio.js inline with text in moodle quiz


So I am using audio.js on my website. I customized audio.min.js that there would be only "PLAY/PAUSE" button visible. I want that button to appear at the left of the text. How can I do that?

Cause right now, text always appears bellow "play/pause" button, in a new line. I want it to be on the same line.

The code on my HTML page looks like this:

<audio>
  <source src="https://www.website.com/voice/sample.mp3">
</audio>
<!-- This is the text I want to see on the same line as the audio tag which is in use with audio.js -->

Solution

  • You have to overwrite audiojs's css in order to modify, and try to add something like this css:

    .audiojs {
      float:left;
    }
    

    There is code: https://jsfiddle.net/qp5xjxb9/1/

    I hope it helps