如何更改JQuery按钮的图标

-1

我想用CSS Sprites图片（img-64x64.png）来替换Icon的Jquery按钮。哪里有错我的代码如下？谢谢！如何更改JQuery按钮的图标

// CSS Sprites Images 
<style type="text/css"> 
    .ui-icon { 
     background-image: url(img/img-64x64.png); 
     width: 64px; 
     height: 64px; 
    } 
    //Image A 
    .ui-icon-A { 
     background-position: -448px 0px; 
    } 
    //Image B 
    .ui-icon-B { 
     background-position: -128px 0px; 
    }  
</style> 

// JQuery code 
<script> 
    $(document).ready(function() 
    { 
     InitBtnIcon(); 
    }); 
// Init Button 
function InitBtnIcon() 
{ 
    //Create Button A 
    $("#btnIconA").button({ 
     icons: { 
       primary: 'ui-icon-A'  
       } 
    }); 
//Create Button B 
$("#btnIconB").button({ 
    icons: { 
      primary: 'ui-icon-B'  
      } 
    }); 
} 
</script> 
//Html code  
<div> 
<button id="btnIconA">Button Icon</button> 
<button id="btnIconB">Button Icon</button> 
</div>

是否有可能将图标更改为jQuery UI按钮上的按钮？我试过这样做。谁可以给我一些关于我的代码的建议，谢谢！

来源

2011-12-28 user1118973

从来没有使用JQ UI，但是你的UI CSS是在你的自定义CSS后加载的？或者你确切的问题是什么？没有图标？仍是标准图标？ – sascha 2011-12-28 10:00:16

按钮上没有任何图标显示。我不知道如何为CSS Sprites编码。 – user1118973 2011-12-28 13:56:52

如果只使用带有background-img的

当我尝试了您的示例代码时，我错过了img-64x64.png，但取决于何时加载CSS代码，您可以添加！important关键字。例如：

.ui-icon { 
    background-image: url(img/img-64x64.png) !important; 
    width: 64px !important; 
    height: 64px !important; 
}

来源

2011-12-29 21:55:43

如何更改JQuery按钮的图标

回答

相关问题