CODEWITHSUNDEEP
javascriptjqueryjquery-ui
DotnetSparrow
DotnetSparrow

Reputation: 27996

changing Jquery Ui Toggle Panel Icons

I am using Jquery UI toggle panel mentioned here:

http://jsbin.com/eqape

I want to use Icons from triangle to circle-arrow

which has two classes circle-arrow-e and circle-arrow-s (selected). How to change following Javascript. 

   $("#notaccordion").addClass("ui-accordion ui-accordion-icons ui-widget ui-helper-reset")
  .find("h3")
    .addClass("ui-accordion-header ui-helper-reset ui-state-default ui-corner-top ui-corner-bottom")
    .hover(function() { $(this).toggleClass("ui-state-hover"); })
    .prepend('<span class="ui-icon ui-icon-triangle-1-e"></span>')
    .click(function() {
        $(this)
        .toggleClass("ui-accordion-header-active ui-state-active ui-state-default ui-corner-bottom")
        .find("> .ui-icon").toggleClass("ui-icon-triangle-1-e ui-icon-triangle-1-s").end()
        .next().toggleClass("ui-accordion-content-active").slideToggle();
        return false;
    })
    .next()
      .addClass("ui-accordion-content  ui-helper-reset ui-widget-content ui-corner-bottom")
      .hide();

Please suggest:

Upvotes: 1

Views: 1065

Answers (1)

IUnknown
IUnknown

Reputation: 22448

$("#accordion").accordion({ active: false, icons: {'header': 'ui-icon-circle-arrow-e', 'headerSelected': 'ui-icon-circle-arrow-s' } });

Upvotes: 1

Related Questions