nzinsli
asked on
jquery accordion custom icons
I setup a basic jquery accordion, but am having issues setting up custom icons. I tried with and without the jquery ui css, and from what I can tell I am using the correct syntax. But when I look at the icon in firebug, my custom style isnt being applied. What am I missing?
Example url - http://bit.ly/JwhclO
CSS -
Example url - http://bit.ly/JwhclO
CSS -
.accordion_up
{
background-image: url(../webimages/master_accordion_arrows_sprite.gif) -11px left !important;
width: 11px;
height: 8px;
}
.accordion_down
{
background-image: url(../webimages/master_accordion_arrows_sprite.gif) top left !important;
width: 11px;
height: 12px;
}
jquery accordion...$(document).ready(function() {
$("#accordion").accordion();
$("#accordion").accordion("option", "autoHeight", false);
$("#accordion").accordion("option", "icons", { 'header': 'accordion_up', 'headerSelected': 'accordion_down' });
});
SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
You need the UI CSS.
ASKER
Thanks guys.
ASKER
One question - Is it not possible to get them to appear w/o adding the http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css reference? As soon as I remove that, they disappear. I really don't want any of the other styles that it puts in, just the icons...So if that's the case, I'll have to create a blank theme in jquery ui theme roller?