I use a secondary fille called custom.css to overwrite the bootstrap code and I would like to know how to create a code that is activating only when the visitor of my site i
To avoid the performance hit of using the scroll, load and resize events, you can now use the Intersection Observer API.
It will allow you to detect if the content on your page has been scrolled, and set the nav bar transparency accordingly (by adding or removing a class).
Have a look at this answer for more details.