gridstack.js issue base

Use this as a base for examples for gridstack.js issues.

by Alain Dumesny

HTML

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/gridstack.min.css">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/gridstack-h5.js"></script>
<h1>H5 vs JQ drag behavior #1511</h1>
<p>switching to legacy js works in all cases...also get no drop cursor</p>
<br />

<div class="grid-stack"></div>

CSS

.grid-stack {
  background: lightgoldenrodyellow;
}

.grid-stack-item-content {
  color: #2c3e50;
  text-align: center;
  background-color: #18bc9c;
}

.x {
  width:100%;
  height:100%;
}

JavaScript

var options = { // put in gridstack options here
  disableOneColumnMode: true, // for jfiddle small window size
  float: false
};
var grid = GridStack.init(options);

var items = [
	{x: 0, y: 0, w: 2, h: 2, content: '<table class="x"><tr><td><span>table does NOT</span></td></tr></table>'},
	{x: 2, y: 0, w: 2, h: 2, content: '<div class="x"><span>works if you click outside span</span></div>'},
	{x: 4, y: 0, w: 2, h: 2, content: '<div class="x">works anywhere div</div>'},
	{x: 6, y: 0, w: 2, h: 2, content: 'works anywhere'},
];

grid.load(items);