1

我正在尝试向股票 gridster.js 小部件添加关闭和最小化图标(按钮)提议的 Gridster.js 小部件

他们的网站上有一个例子:http: //gridster.net/demos/custom-drag-handle 但它只是为标题创建背景颜色的一种简单方法,并没有说明如何附加按钮(句柄)关闭并最小化..有什么建议吗?

4

1 回答 1

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 中的。在这个例子中,我还使用带有字体真棒图标的纯按钮。此外,我使按钮“浮动”到右侧并减小了它的大小。您可以像往常一样使用 javascript 向按钮添加操作(如关闭或调整大小)。

于 2014-11-29T15:04:30.267 回答