Tenho o seguinte código jQuery
:
$('.dock-a').hide();
$('.dock').each(function(){
var DOCK = $(this);
DOCK.click(function(){
var DOCK_largura = $(window).width(),
DOCK_index = $(this).index(),
DOCK_content = $('.dock-content:eq('+DOCK_index+')'),
DOCK_a = $('.dock-a:eq('+DOCK_index+')');
beforeClick = $(window).scrollTop();
DOCK_content.animate({ 'width': DOCK_largura+'px' }, 500);
DOCK_a.delay(500).show().animate({ 'opacity':'1' }, 300);
DOCK_content.delay(400).animate({ 'height': DOCK_a.outerHeight(true)+'px' }, 200);
});
});
A finalidade dele é: quando alguém clicar em um link
com a classe .dock
, ele abre um conteúdo em cima da página atual, semelhante a uma shadowbox
. O problema é que somente o primeiro link funciona, acredito que está dando alguma falha em obter o valor index
de cada elemento sequencial.
No HTML
está assim:
<div class="link">
<div class="box">
<a href="#" class="dock">Um</a>
</div>
</div>
<div class="link">
<div class="box">
<a href="#" class="dock">Dois</a>
</div>
</div>
<div class="link">
<div class="box">
<a href="#" class="dock">Três</a>
</div>
</div>
<div class="dock-content">
<div class="dock-a">
Texto do link Um.
</div>
</div>
<div class="dock-content">
<div class="dock-a">
Texto do link Doi.
</div>
</div>
<div class="dock-content">
<div class="dock-a">
Texto do link Três.
</div>
</div>
Testei um script
simples em um arquivo á parte, com a mesma funcionalidade e deu certo. Provavelmente é o valor index
que está dando erro, mesmo.