react-draggable
react-draggable copied to clipboard
Draggable react bootstrap Modal moves the browser scroll bar
trafficstars
If I wrap a Modal object from react-bootstrap within a Draggable tag, and if the Modal is too large for the browser window so that a vertical scroll bar appears in the browser, moving the Modal object with my mouse also moves the vertical scroll bar with it. The vertical scroll bar should stay right where it is and the Modal object should move independently with the mouse.
Here is a code snippet:
import { Modal } from 'react-bootstrap' import Draggable from 'react-draggable'
export default class MyDraggableModal extends Component {
render() {
return (
<Draggable handle=".modal-header">
<Modal animation={false} backdrop={false} show={true}>
<Modal.Header>My Header</Modal.Header>
<Modal.Body>
A large dialog so that vertical scroll bars will appear when the browser is resized too small....
</Modal.Body>
<Modal.Footer>My Footer</Modal.Footer>
</Modal>
</Draggable>
)
}
}
have you solved it @nperriwp
No