por favor vea a continuación div:

 <link href="https://code.jquery.com/ui/1.9.2/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" /> <script src="https://code.jquery.com/jquery-1.8.3.min.js"></script> <script src="https://code.jquery.com/ui/1.9.2/jquery-ui.js"></script> <%for id in 1..5 do%> <div id="product_<%=id%>"> <div style ="height:10px;margin-top:10px;"></div> <span class="normal_cell"></span> <span class="start_cell"></span> <span class="normal_cell"></span> <span class="normal_cell"></span> <span class="end_cell"></span> <span class="normal_cell"></span> <span class="normal_cell"></span> </div> <%end%>

Aquí, el número de "normal_cell" entre "start_cell" y "end_cell" varía (también antes y después) para cada fila de producto según la fecha de inicio y la fecha de cada producto.

 <style> .normal_cell { float: left; width: 20px; height: 20px; background: yellow; border-right:1px solid gray; margin-right: 1px; } .start_cell, .end_cell { float: left; width: 20px; height: 20px; background: green; margin-right: 1px; border-right:1px solid gray; } </style> <script> $(function() { ApplyResizablePluginToCol($(".end_cell")); function ApplyResizablePluginToCol(elements){ elements.resizable({ maxHeight: 20, minHeight: 20, distance: 5, handles: 'e', start: function() { console.log("I've started!"); }, stop: function() { console.log("I've stopped!"); } }); } }); </script>

¿Cómo puedo implementar un gráfico de tamaño variable (tanto 'e' como 'w') en tal div. El número de celdas en cada fila es igual. Pero el gráfico se dibuja para cada producto entre start_cell y end_cell, según la fecha de inicio y finalización.

Si coloco un ícono de cambio de tamaño en end_cell, entonces puedo moverlo hacia el lado derecho correctamente, pero hacia el lado izquierdo, solo se puede mover una pequeña área.

Por favor ayuda.

Gracias