如何添加關閉最小化到標題Gridster.js小部件

Question

我想添加關閉和最小化圖標（按鈕）喜歡股票gridster.js部件。

在他們的網站上有一個例子：http://gridster.net/demos/custom-drag-handle但它只是一個簡單的方法來創建一個標題的背景顏色，並沒有說明你如何可以在按鈕（句柄）關閉和最小化..任何建議？

Answer 1

這已經被問前一陣子，但如果你還在尋找一個答案，像我，這琴應該能夠給你一個想法：

JSFIDDLE

這不是我的，剛剛找到它。

編輯：我自己想出了一個簡單的解決方案。

您可以將標題添加到要創建的小部件並在其中放置按鈕。 例如爲：

<li data-row="1" data-col="1" data-sizex="8" data-sizey="4"> 
     <header> 
     <button class="pure-button" id="close-widget-button" style="font-size: 50%; float: right;"> 
      <i class="fa fa-remove"></i> 
     </button> 
     </header> 
     <iframe id="myframe" src="web/widgets/basiclinewidget2.html" width="600" height="300" frameborder="0"> 
     </iframe> 
    </li> 

在本例中的實際的部件是從服務器中取出並在iframe加載。 在本例中，我也使用pure按鈕，其中font-awesome圖標。此外，我將按鈕'浮動'向右並減小其大小。 您可以像往常一樣使用JavaScript將操作（如關閉或調整大小）添加到按鈕。