"append" não funciona

[joaowebdesigner 0]

Olá, estou utilizando em uma determinada galeria de fotos o famoso "colorbox", e ele por padrão captura o valor do atributo "title" de cada imagem e printa no box em formato de legenda. Até aí beleza. Porém, eu preciso adicionar antes uma legenda personalizada, cujo valor será o mesmo de um "span" existente no html, e para isso tentei usar a função "append", mas não tá rolando. Abaixo, coloco em detalhes:

 

<script type="text/javascript">
jQuery(document).ready(function() {
$('#galeria_revestimentos > a[rel="colorbox"]').colorbox({
	width: '40%',
	height: '70%'
});
var especificacoes = $('#galeria_revestimentos > a').find('span.especificacoes').html();
$('#cboxLoadedContent').append('<div class="captionColorbox">'+ especificacoes +'</div>');
});
</script>

 

E a marcação:

 

<div id="galeria_revestimentos">
<a rel="colorbox" href="img/galeria_revestimentos/rev_396.jpg" title="Revestimento 396"><img src="img/galeria_revestimentos/thumb1_galeria_revestimentos.jpg" width="206" height="150" alt=" " /><span class="especificacoes">content 1</span></a>
<a rel="colorbox" href="img/galeria_revestimentos/rev_398.jpg" title="Revestimento 398"><img src="img/galeria_revestimentos/thumb2_galeria_revestimentos.jpg" width="206" height="150" alt=" " /><span class="especificacoes">content 2</span></a>
<a rel="colorbox" href="img/galeria_revestimentos/rev_496.jpg" title="Revestimento 496"><img src="img/galeria_revestimentos/thumb3_galeria_revestimentos.jpg" width="206" height="150" alt=" " /><span class="especificacoes">content 3</span></a>
<a rel="colorbox" href="img/galeria_revestimentos/rev_552.jpg" title="Revestimento 552"><img src="img/galeria_revestimentos/thumb4_galeria_revestimentos.jpg" width="206" height="150" alt=" " /><span class="especificacoes">content 4</span></a>
<a rel="colorbox" href="img/galeria_revestimentos/rev_564.jpg" title="Revestimento 564"><img src="img/galeria_revestimentos/thumb5_galeria_revestimentos.jpg" width="206" height="150" alt=" " /><span class="especificacoes">content 5</span></a>
<a rel="colorbox" href="img/galeria_revestimentos/rev_594.jpg" title="Revestimento 594"><img src="img/galeria_revestimentos/thumb6_galeria_revestimentos.jpg" width="206" height="150" alt=" " /><span class="especificacoes">content 6</span></a>
</div>

 

TRaduzindo:

-> #galeria_revestimentos = é a div que contém a galeria

-> span.especificacoes = é o span que tem o conteúdo da legenda que preciso adicionar

-> #cboxLoadedContent = é o box do script "colorbox" que contém a img em tamanho grande

 

A legenda que eu preciso deve vir após essa div #cboxLoadedContent, mas com o meu código não tá aparecendo nada. O que pode estar errado? Com a função "after" até apareceu, mas o conteúdo da legenda não tava entrando no loop que deveria, ou seja, tava se repetindo mesmo a imagem do slideshow sendo alterada.

 

Alguém pode dar-me um help? Obrigado!

[William Bruno 1501]

cara, para fazer da forma correta, você precisa cantar a musica que o plugin toca.

 

abra o código fonte do plugin, estude e faça.

veja na documentação se ele disponibiliza algum callback.

 

dessa forma ai você não vai conseguir.

[JCMais 75]

Você pode passar como título uma função anônima que retorna o título a ser usado:

       $('#galeria_revestimentos > a[rel="colorbox"]').colorbox({
               width : '40%',
               height: '70%',
               title : function(){
                       return 'título';
               }
       });

 

Fonte: http://colorpowered.com/colorbox/

[joaowebdesigner 0]

Então William, a questão é que eu não sei que música o plugin toca. Não sou avançado em jQuery e na documentação do "jQuery colorbox" somente existem tópicos sobre o uso do atributo title, que eu já utilizo. A idéia é justamente ter uma legenda com um conteúdo em html de forma a complementar o que o colorbox já oferece.

[William Bruno 1501]

é só ler a documentação. Se você tiver medo, 'nunca será avançado'.

 

viu o post do JC Mais ? 'era só isso'.