0

我在以 jQuery-UI 为主题的 fullCalendar 中执行以下操作：

var overlay = $('<div />');
   overlay.addClass(event.status);
   if(overlay.hasClass('pending')) {
      primaryIcon = 'ui-icon-check';
    } else {
      primaryIcon = 'ui-icon-cancel';
    }
    overlay.button({ icons: {
      primary: primaryIcon },
      text:false
    });

  overlay.css({
    'cursor': 'pointer',
    'float': 'right'

  });

但我的按钮看起来像这样 - http://cl.ly/2H1j3Z3i3G34271O2E2w

我也尝试过不使用按钮并在跨度上设置“.ui-state-default .ui-icon”，但背景没有显示。有谁知道这可能是什么原因造成的？

我希望按钮像这里的第一个图标一样是方形的：

4

2 回答 2

1

我想你只需要添加一个附加样式，width:auto：

overlay.css({
    'cursor': 'pointer',
    'float': 'right',
    'width': 'auto'
});

参见示例：http: //jsfiddle.net/william/Lu3GS/1/。

查看您的代码，您实际上并不需要这些是实际的按钮。如果是这种情况，您可以考虑使用内联图标：http: //jsfiddle.net/2U5TN/1/。

于 2011-08-24T12:05:21.520 回答
0

我最终将按钮的宽度和高度设置为相等，并将字体大小设置为零（因此图标图像将位于按钮的中心）。CSS代码是：

#your_button_id {
   position: relative; 
   font-size: 0; 
   width: 23px; 
   height: 23px;
}

在您的情况下，它将是：

overlay.css({
    'cursor': 'pointer',
    'float': 'right',
    'width': '23px',
    'height': '23px',
    'font-size': '0'
});
于 2015-09-01T19:18:25.893 回答