Imagem Accordion Primefaces

Front-end
#1

Pessoal,
alguém já conseguiu colocar uma imagem na Tab do Accordion.
Estava precisando disso.
Gostaria de colocar em cada tab uma imagem diferente.

Obrigado!

#2

ja tentou fazer com CSS?

t+

#3

Acho que seria muita gabiarra, pq teria que criar um estilo para cada aba…

#4

tem nada de gambiara nao cara, é assim msm que faz.

#5

Você conseguiu, Mr.style?

Se sim, compartilhe a solução, por favor.

Abraços

#6

Para os desesperados que porventura chegarem até aqui, segue a solução:

No estilo.css, crie um estilo no seguinte formato:

.image-accordion-tab-1  {background: url("urlDaSuaImagemParaItem1.png") no-repeat;}
.image-accordion-tab-2  {background: url("urlDaSuaImagemParaItem2.png") no-repeat;}

E no seu accordion:

<p:accordionPanel value="#{seuBean.suaLista}" var="item"> <p:tab titleStyleClass="image-accordion-tab-#{item.id}"> </p:tab> </p:accordionPanel>

Note que os itens da sua lista precisam ter algum tipo de identificador para que possa diferenciá-los uns dos outros. Nesse caso, usei um “id”, que poderia ser 1 ou 2.

Abraços!

#7