Jquery Slickbox questão de alternância
Pergunta
Aqui está o código que estou usando
$(document).ready(function(){
$('#slickbox').hide();
// toggles the slickbox on clicking the noted link
$('a#slick-show').click(function() {
$('#slickbox').show('slow');
return false;
});
// hides the slickbox on clicking the noted link
$('a#slick-hide').click(function() {
$('#slickbox').hide('fast');
return false;
});
// toggles the slickbox on clicking the noted link
$('a#slick-toggle').click(function() {
$('#slickbox').toggle(400);
return false;
});
});
Aqui está o código HTML:
<div id="slickbox"> BLARGH</div>
<a href="#" id="slick-show">Show</a>
<a href="#" id="slick-hide">hide</a>
<a href="#" id="slick-toggle">toggle</a>
mostrar e ocultar o trabalho perfeitamente bem. Blargh é escondido quando o navegador abre e eu posso mostrar e esconder isso, mas clicando nos links. Meu problema tho, é que quando clico de alternância, se lâminas brevemente abrir para mostrar blargh e, em seguida, desliza fecha. I pode clicar nele tantas vezes quanto eu quero e ele faz a mesma coisa. Como faço para obtê-lo para ficar mostrado e, em seguida, clique novamente para escondê-lo?
Solução
$('a#slick-toggle').click(function() {
$('#slickbox').is(":visible") ? $('#slickbox').hide("fast") : $('#slickbox').show("slow");
return false;
});
ou você pode acionar os cliques do show / hide ligações, e de que maneira você não teria que alterar a implementação de a#slick-toggle
Se você decidir mudar as animações:
$('a#slick-toggle').click(function() {
$('#slickbox').is(":visible") ? $('a#slick-hide').trigger("click") : $('a#slick-show').trigger("click");
return false;
});
Outras dicas
$('a#slick-toggle').toggle(function() {
$('#slickbox').show();
return false;
}, function() {
$('#slickbox').hide();
});
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow