Skip to content

Conversation

@MarsHeer
Copy link

Script now has option to observer mutations by adding "mini-observer" class to any elements which may hold dynamic content.

It also handles window resize to stop the contents from breaking

Script now has option to observer mutations by adding "mini-observer" class to any elements which may hold dynamic content.

It also handles window resize to stop the contents from breaking
@minimax711
Copy link
Owner

Script now has option to observer mutations by adding "mini-observer" class to any elements which may hold dynamic content.

It also handles window resize to stop the contents from breaking

Hey there!
So the "observer" helps recalculating the size/position if the parent element is dynamically changed?

Is there a way to put different versions of this script in this repository? like #1vanilla #2with mutation observer & window resize listener ?
Thanks for your help!

@MarsHeer
Copy link
Author

Hey!

Not exactly. The observer here does two things: Listens for changes in the DOM. So say if I use your script in an infinite scroll, where images are created as you scroll down, the script would need to re-run to target the newly created images, so that's what that's doing. Also if classes are mutated, say I want to enable/disable the parallax, it will listen to that and re-execute the script to allow for that. We can also make it re-execute if parallax attributes like speed are changed dynamically, though it's not currently set up.

Here's some information on MutationObservers so you can see what can be done with it :) https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver

You can of course have as many different files/versions as you want with the different features. I'll go ahead and push a "dynamic" version alongside yours to the pull request but you can go ahead and name them whatever you think suits best!

@minimax711
Copy link
Owner

Gotcha!
Will take care of it asap!
Just need to get rid of covid atm 😅

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants