gridstack.js issue base

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

by Alain Dumesny

HTML

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/gridstack-h5.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/gridstack.min.css">

 


 <div class="grid-stack">
    <div class="grid-stack-item"   gs-id="4aevj48vdw3d868mnn1ae35acm">
    
         <div class="grid-stack-item-content">
             widget 1 content 
          </div>
    </div>
   
     <div class="grid-stack-item"  gs-id="4rmv2mn359hb5zbv64rya8cbc2" >
        <div class="grid-stack-item-content">
       
           widget 2 content 
        </div>
    </div>
</div>

CSS

.grid-stack {
  background: lightgoldenrodyellow;
}

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

JavaScript

var data = [{id: "4aevj48vdw3d868mnn1ae35acm",x:0,y:0,w:4,h:5}, {id: "4rmv2mn359hb5zbv64rya8cbc2",x:5,y:0,w:6,h:6} ];

var options = {  
    animate: true, 
    disableOneColumnMode: true, // for jfiddle small window size
    float: false
};
 var grid = GridStack.init(options);
 grid.load(data);