0

我已使用此处的信息在 IE9 中使用以下代码在 JqGrid 顶级工具栏中添加自定义按钮。

出现插入符号图标而不是图像。IE9 网络选项卡显示未发出对 Images/calendar.png 的请求。

   $grid.jqGrid('navButtonAdd', '#grid_toppager', {
        caption: '',
        id: "grid_mybutton",

        buttonicon: 'my-image',
        onClickButton: function () { 
            window.location =  'Report';
          }
    });

css 文件：

.ui-button .ui-icon.my-image { 
    background-image: url("Images/calendar.png"); 
    width: 16; 
    height: 16;  
} 

.ui-button.ui-state-hover .ui-icon.my-image { 
    background-image: url("Images/calendar.png"); 
    width: 16; 
    height: 16;  
}

如何添加自定义图标？

4

2 回答 2

3

jQuery 样式将始终覆盖您最后应用的样式。

除了jjay225指出您修复参考的内容之外，将!important标签添加到您的图像样式中以确保始终应用它。

在下面的演示中尝试一下，删除!important，然后你会得到^，再次添加它，你会得到你的图像。

见演示

没有您的完整代码，我只是使用 jQuery 在工具栏上添加了一个图标append()并添加了所需的 CSS。

但是，使用任何调试工具，即：FF 中的 FireBug 和 Chrome 或 IE 中的内置工具，您可以检查新图标的确切类/id 值并修复您可能遇到的任何 css 引用问题。

于 2012-08-13T11:25:35.670 回答
1

你的CSS

.ui-button.ui-state-hover .ui-icon.my-image

应该

 .ui-button, .ui-state-hover, .ui-icon, .my-image

为什么不尝试上课

.my-image
{
    background-image: url("Images/calendar.png"); 
     width: 16; 
     height: 16;  
  }
于 2012-08-13T11:59:04.003 回答