Question

我是Jquery UI和CSS的新手，我正在尝试制作一个非常简单的手风琴。所以手风琴工作正常，但它根本没有显示图标，我无法弄清楚为什么它不会显示图标，我已经确认图形是在网址，所以我知道图形存在那里，我一直能够毫无困难地将图形用于其他网站。当我开始将Jquery UI添加到页面中时出现问题。我将我发布的代码更改为... / filename.ext，以便不显示我工作的公司信息或我正在处理的网站。任何建议或任何人可以提供的帮助将不胜感激。

HTML / JS

<meta charset="utf-8">
<title>jQuery UI Accordion - Collapse content</title>
<link rel="stylesheet" href=".../jquery.ui.all.css">
<script src=".../jquery-1.9.1.js"></script>
<script src=".../jquery-ui.js"></script>
<script src=".../jquery.ui.core.js"></script>
<script src=".../jquery.ui.widget.js"></script>
<script src=".../jquery.ui.accordion.js"></script>
<script src=".../jquery.ui.button.js"></script>
<link rel="stylesheet" href=".../demos.css">
<link rel="stylesheet" href=".../icon.css">
<script>
$(function() {
$( "#accordion" ).accordion({
collapsible: true, active: false, icons: { header: "iconPlus",       activeHeader: "iconMinus" }
}); 
var active = $( "#accordion" ).accordion( "option", "active" );
$( "#accordion" ).accordion( "option", "active", false );
$( "#accordion" ).accordion( "option", "icons", { header: "iconPlus",  activeHeader: "iconMinus" });

});
</script> 
</head>
<body>
<div id="accordion" style="background-color:#D0E1FF;color:#CC0000;">
<h3 style="background-color:#5555FF;color:#00CC00;"><a href="#">Map Tools</a></h3>
<div style="text-align: center">
<a href="http://maps.google.com/" target="_blank"><img   src=".../GoogleMaps2.jpg"    border="0" alt="" style="text-align: center; border-bottom: 0px; border-left: 0px; padding-    bottom: 0px; margin-top: 0px; padding-left: 0px; width: 100px; padding-right: 0px;     margin-bottom: 0px; height: 75px; border-top: 0px; border-right: 0px; padding-top:    0px"/></a>         
<a href="http://www.bing.com/maps" target="_blank"><img src=".../BingMaps.jpg" border="0" alt="" style="border-bottom: 0px; border-left: 0px; padding-bottom: 0px; padding-left: 0px; width: 100px; padding-right: 0px; height: 75px; font-size: 10pt; border-top: 0px; border-right: 0px; padding-top: 0px"/></a>            
<a href=".../Map.aspx" target="_blank"><img src=".../Map.JPG" border="0" alt="" style="border-bottom: 0px; border-left: 0px; padding-bottom: 0px; padding-left: 0px; width: 100px; padding-right: 0px; height: 75px; font-size: 10pt; border-top: 0px; border-right: 0px; padding-top: 0px"/></a>&#160;
</div>
<h3 style="background-color:#55FF55;color:#0000CC;">Reference Tools</h3>
<div>
<p>References...</p>
</div>
<h3 style="background-color:#FF5555;color:#0000CC;">Agent Tools</h3>
<div>
<p>Tools like vacation calendar, schedule viewer, etc...</p>
</div>
<h3 style="background-color:#FFFFFF;color:CC0000;">Organizational Tools</h3>
<div>
<p>ORG Charts, Account and Network managers, etc...</p>
</div>
</div>
</body>
</html>

CSS

<style type="text/css">
.iconPlus
{
background:url(.../BluePlus.png) !important;
background-size:20px !important;
width:20px;
height:20px;
}
.iconMinus
{
background:url(.../BlueMinus.png) !important;
background-size:20px !important;
width:20px;
height:20px;
}
</style>

JQuery UI图标没有显示在我的手风琴上？

0 个答案: