[jQuery] Cleaning the code
Hello! I have implemented a small function using jQuery.
Unfortunately, I'm still a noob, and I have certainly written a code
longer and more repetitive than it could be. I would therefore ask you
an help to simplify it and improve it.
To simplify things better, you can find what I have done at this
address: http://www.flyareatest.altervista.org/provafade/index.html
The part of the code that i would like to improve is:
jQuery(function($){
$(".toggler").click(function(){
$(".content").fadeToggle();
$(".content1").fadeOut("slow");
$(".content2").fadeOut("slow");
$(".content3").fadeOut("slow");
$(".content4").fadeOut("slow");
$(".content5").fadeOut("slow");
});
$(".toggler1").click(function(){
$(".content1").fadeToggle();
$(".content").fadeOut("slow");
$(".content2").fadeOut("slow");
$(".content3").fadeOut("slow");
$(".content4").fadeOut("slow");
$(".content5").fadeOut("slow");
});
$(".toggler2").click(function(){
$(".content2").fadeToggle();
$(".content").fadeOut("slow");
$(".content1").fadeOut("slow");
$(".content3").fadeOut("slow");
$(".content4").fadeOut("slow");
$(".content5").fadeOut("slow");
});
$(".toggler3").click(function(){
$(".content3").fadeToggle();
$(".content").fadeOut("slow");
$(".content1").fadeOut("slow");
$(".content2").fadeOut("slow");
$(".content4").fadeOut("slow");
$(".content5").fadeOut("slow");
});
$(".toggler4").click(function(){
$(".content4").fadeToggle();
$(".content").fadeOut("slow");
$(".content1").fadeOut("slow");
$(".content2").fadeOut("slow");
$(".content3").fadeOut("slow");
$(".content5").fadeOut("slow");
});
$(".toggler5").click(function(){
$(".content5").fadeToggle();
$(".content").fadeOut("slow");
$(".content1").fadeOut("slow");
$(".content2").fadeOut("slow");
$(".content3").fadeOut("slow");
$(".content4").fadeOut("slow");
});
In essence, this is a page with 6 links and 6 initially hidden div. By
clicking on a link, the div appears relevant, it disappears by
clicking on the link again thanks to fadeToggle function. By clicking
on a different link, the div (already opened). disappears thanks to
fadeOut function.
Thank you all for your help!