Alterar o icone do accordion

05/03/2014

0

Ola galera estou tendo um trabalho para alterar o icone da minha header no accordion, ja tentei de tudo e o icone nao aparece la alguem sabe como faço, e que na verdade ele inicia com o icone de (mais) e quando é selecionado ele fica com o icone (x) para fechar.

fiz um script assim mas nao trocou.
   <script type="text/javascript">
         $(function () {
             $('.efeito').accordion({
                collapsible: true,
                autoHeight: false,
                active: false
             });
             $('.efeito').accordion("option", "icons", {
                 'Header': 'defaultIcon', 'HeaderSelected': 'selectedIcon'
             });
         });
     </script>


e meu css ta assim chamando as imagens.
   .defaultIcon{ background-image:url(images/open.png) important; }
.selectedIcon{background-image:url(images/close.png) important; }


se puderem ajudar galera grato.

Miller.
Celiol.

Celiol.

Responder

Posts

06/03/2014

Joel Rodrigues

Já tentou forçar essa alteração via jQuery?
Responder

06/03/2014

Celiol.

entao cara dei uma pesquisada e no jquery eu vi como coloquei ai mas tem que declarar no css tambem.
Responder

07/03/2014

Joel Rodrigues

Tem um live demo desse acoordion pra eu dar uma olhada?
Responder

07/03/2014

Celiol.

pior que não tenho cara, mas e simples não tem firulas não é o mesmo que o exemplo do Jquery só não consegui colocar o link, e que o css la não mostra o exemplo é linkado por uma url.

mas eu postei o código aqui.
Responder

07/03/2014

Rafael Carrenho

No código CSS você já colocou a exclamação antes do "important"?

.defaultIcon{ background-image:url(images/open.png) !important; }
.selectedIcon{background-image:url(images/close.png) !important; }
Responder

07/03/2014

Celiol.

ha cara eu nao tinha colocado mesmo nem tinha reparado mas mesmo assim nao deu em nada com o "!"....
Responder

07/03/2014

Joel Rodrigues

Bom, eu testei aqui seguindo o exemplo do site e deu certo. Creio que o problema esteja na passagem dos parâmetros para a função. Ajuste seu código de acordo com esse exemplo: [url:descricao=http://jqueryui.com/accordion/#custom-icons]http://jqueryui.com/accordion/#custom-icons[/url].
Responder

Assista grátis a nossa aula inaugural

Assitir aula

Saiba por que programar é uma questão de
sobrevivência e como aprender sem riscos

Assistir agora

Utilizamos cookies para fornecer uma melhor experiência para nossos usuários, consulte nossa política de privacidade.

Aceitar