How to modify txtProgress Plugin?

How to modify txtProgress Plugin?

Hi there,

I want to use this jQuery Plugin listed here:  https://www.jqueryscript.net/loading/Minimalist-Text-Loading-Progress-Indicator-Plugin-txtProgress.html .
But be patient, the demo site you can click here, is the demo site from the unmodified plugin, if you download it there is the right example page to the new modified code. This is the one i'm talking.

So i want to use this insde my bootstrap 4 website, but i noticed some problems.
I noticed that the plugin uses the class name ".progress" which conflicts with the bottstrap 4 clsses, because they use this classname for theri progress bars. So easy way is to change the class name, which seems to work.

But the real problem is, that i want to to modfy the code a little bit. How can i change the code, so that the progress bar under the text and the text will be filled in the width of the text and not of the whole container. So if i select the slider to let's say 50% i want that the text and the underlying progress bar will be filled to only 50% of the length of the text and not to 50% of the parent container.

Another point: How can i apply the plugin to my custom text? In the code span elements are used, but in my website i have to use h2 elements instead of the spans, but if change this, it will not work correctly and the text will be loaded inside the bar and crashes the design. Could the code changed so that it maybe works with every element instead of span?

I hope someone of you can help me with my problem. Thanks a lot!