Repository navigation
4.x: style="position: sticky" messing up Dragging #1704
Description
Subject of the issue
I am trying to make a lot of custom widgets to add to multiple grids. In order to access all of the widgets these stay in a sticky positioned <div> (position: fixed behaved the same way). Regardless of using float option true/false in the second grid it is not possible to position the dragged in widget under the other widgets.
Your environment
- Version 4.0.3 tested in HTML5 and jQuery versions
- Browser tested: Firefox (Linux), Chrome (Linux), Edge (Windows 10)
Steps to reproduce
https://codepen.io/Dodger77/pen/KKaaaJN (HTML5 version with float: true)
https://codepen.io/Dodger77/pen/qBRRvEm (jQuery version with float: false)
Expected behavior
Get new dragged in widgets positioned under the existing widgets.
Actual behavior
New dragged in widgets will always be on top of the second grid when dragged in.
Activity
Dodger77 commentedon Apr 1, 2021
Here as a comparison the same code with gridstack.js 3.3.0 that is working:
https://codepen.io/Dodger77/pen/GRrrevw
adumesny commentedon Apr 4, 2021
I see the issue https://jsfiddle.net/adumesny/esyLr4hf/
looks like
<div style="position: sticky; top: 0;">is messing up the scroll bar computation for the second grid.[-]Dragging items from sticky source into grid only on top of grid[/-][+]4.x: style="position: sticky" messing up Dragging[/+]scrollbar fix
scrollbar fix
adumesny commentedon Apr 11, 2021
fixed in next release. don't forget to donate if you find lib useful!
Dodger77 commentedon Apr 16, 2021
Thank you very much!