30-11-2010, 11:07
Bom dia,
estou a fazer uma função que basicamente me adiciona ou remove classes a uma div e a uma lista... para com isto conseguir mudar a estrutura de um layout à medida que o utilizador clica num item da lista.
A coisa já funciona mas eu não sou lá grande coisa em jquery então a função está um pouco extensa e tem um bug que gostava que me ajudassem a resolver.
segue a função:
o que acontece é que quando clico num item da lista pela primeira vez tudo acontece como esperado, a class muda, no entanto se mudar para outra vista e dps voltar a clicar na primeira preciso de dois clicks para a coisa funcionar...
alguma sugestão?
estou a fazer uma função que basicamente me adiciona ou remove classes a uma div e a uma lista... para com isto conseguir mudar a estrutura de um layout à medida que o utilizador clica num item da lista.
A coisa já funciona mas eu não sou lá grande coisa em jquery então a função está um pouco extensa e tem um bug que gostava que me ajudassem a resolver.
segue a função:
Código PHP:
$("li.layout1").toggle(function(){
$(this).addClass("block1");
$("li.layout2").removeClass("block2");
$("li.layout3").removeClass("block3");
$("div.project").fadeOut("slow", function() {
$(this).fadeIn("slow").removeClass("txt-img-grid");
$(this).fadeIn("slow").removeClass("txt-grid");
$(this).fadeIn("slow").addClass("img-grid");
});
}, function () {
$(this).removeClass("block");
$("ul.display").fadeOut("slow", function() {
$(this).fadeIn("slow").removeClass("thumb_view1");
});
});
$("li.layout2").toggle(function(){
$(this).addClass("block2");
$("li.layout1").removeClass("block1");
$("li.layout3").removeClass("block3");
$("div.project").fadeOut("slow", function() {
$(this).fadeIn("slow").removeClass("img-grid");
$(this).fadeIn("slow").removeClass("txt-grid");
$(this).fadeIn("slow").addClass("txt-img-grid");
});
}, function () {
$(this).removeClass("block");
$("ul.display").fadeOut("slow", function() {
$(this).fadeIn("slow").removeClass("thumb_view2");
});
});
$("li.layout3").toggle(function(){
$(this).addClass("block3");
$("li.layout1").removeClass("block1");
$("li.layout2").removeClass("block2");
$("div.project").fadeOut("slow", function() {
$(this).fadeIn("slow").removeClass("txt-img-grid");
$(this).fadeIn("slow").removeClass("img-grid");
$(this).fadeIn("slow").addClass("txt-grid");
});
}, function () {
$(this).removeClass("block");
$("ul.display").fadeOut("slow", function() {
$(this).fadeIn("slow").removeClass("thumb_view3");
});
});
o que acontece é que quando clico num item da lista pela primeira vez tudo acontece como esperado, a class muda, no entanto se mudar para outra vista e dps voltar a clicar na primeira preciso de dois clicks para a coisa funcionar...
alguma sugestão?