Reveal with bootstrap 4 collapsibles

[D4RKAR117]

Environment

• Operating System: Ubuntu 18.0.4.1
• Browser Version: Opera 56.0.3051.52
• ScrollReveal Version: 4.0.4

Hello, im trying to use the scroll reveal functions with components inside of bootstrap 4.1 collapsibles, but the elements doesnt show up when i show up the collapsed element

Demo Here

Thank you for this awesome lib :)

[jlmakes]

Thanks for the demo @D4RKAR117

the elements doesnt show up when i show up the collapsed element

This is because when you call ScrollReveal().reveal() on something, it prepares the element to be revealed when it enters the viewport via scroll or resize events; ScrollReveal depends on these events, and element visibility within the viewport. What is more, a lot of ScrollReveal's code is dedicated to creating and applying styles at the right time during scroll.

In your case, you don't care about scroll, or visibility within the viewport necessarily—you are trying to use ScrollReveal to drive animations within Bootstrap's collapsible. That means a lot of the work ScrollReveal does for you wouldn't be used.

For this reason I discourage using ScrollReveal in this case. I think it would far simpler to create your own CSS, and simply work with classes.

---

That being said, this demo shows how it can be hacked together using Bootstrap's collapse events.

[D4RKAR117]

Thank you, It's something I imagined, but my only way to ask is this XD, do you think I can shoot the revelation of those specific objects with something of js ??, maybe when a function is activated or something similar?, I am a amateur and the truth for more than read sometimes I can not make things work.

Keep your awesome work :D

PD: How compatible is your library with anime.js ?, I would be interested in using them with some elements

[jlmakes]

ScrollReveal has two main parts:

• Part 1: Creating styles from options
• Part 2: Adding/removing those styles at the right time during scroll

These two things combine to create a very specific tool; ScrollReveal isn't designed to have its parts replaced with other libraries; you may be able to get things working, but as we discussed earlier, things may grow more complicated than necessary.

[jlmakes]

Also, you're not the first person to ask about this sort of stuff, so I am considering making ScrollReveal more modular in the future. I appreciate your input!

[D4RKAR117]

Thank you, I am a fan of your work and that you answer me makes me very happy, and I will take into account what you say, sometimes I complicate a lot trying to combine the effects of many javascript libraries at the same time.

Keep creating great things :)