Fork me on GitHub

I have a modal popup that needs to be scrollable, and I want to prevent scrolling through the main html elem when it's open. Would the best way to accomplish this be a callback ref on the trigger elements (i.e. open/close buttons), which sets the html's style directly?


@ctamayo the state with a "class" toggable?


what I'm asking is where in my code I would go about mutating the DOM, whether that's toggling a class, setting a style, or whatever. Reagent is reaching outside of the component, all the way up to the html element, so this isn't something being rendered by hiccup.


Well.. I'm new in this stuff but i'd try to set the html { overflow-y: hidden; }, and in your main component add a main [:div] will handle the overflow auto.. , so you can manage now that div with the state


yes, the issue of how to handle scrolling and how to render the modal div is all taken care of. I'm asking specifically about where in the code I should set overflow: hidden. In the click handler for each trigger element?


Yes, I understand the question, the other solution I think is access directly (without reagent) the element