$(document).ready(function() {
 
var bild = $("div.startbildrahmen div.startbild img");
for (var i=0; i<bild.size(); i++) {
bild.eq(i).addClass("bild"+i);
}
var beschreibung = $("div.starttext");
for (var i=0; i<beschreibung.size(); i++) {
beschreibung.eq(i).addClass("beschreibung"+i);
}
 
var titel = $("div.startbildrahmen a");
var titelanzahl=titel.size();
var gesamtbreite=489;
var linkelement=gesamtbreite/titelanzahl;

for (var i=0; i<titelanzahl; i++) {
titel.eq(i).css("left",i*linkelement+"px");
titel.eq(i).css("width",linkelement+"px");
titel.eq(i).addClass("link"+i);
}


$(".link0").click(function(){ 
         allout(bild,beschreibung);        
         $(".beschreibung0").fadeIn();
         $(".bild0").fadeIn();
         $(".link0").addClass("aktiv");
         return false;
});

$(".link1").click(function(){  
         allout(bild,beschreibung);        
         $(".beschreibung1").fadeIn();
         $(".bild1").fadeIn();
         $(".link1").addClass("aktiv");
         return false;
});

$(".link2").click(function(){  
         allout(bild,beschreibung);        
         $(".beschreibung2").fadeIn();
         $(".bild2").fadeIn();
         $(".link2").addClass("aktiv");
         return false;
});

$(".link3").click(function(){   
         allout(bild,beschreibung);       
         $(".beschreibung3").fadeIn();
         $(".bild3").fadeIn();
         $(".link3").addClass("aktiv");
         return false;
});

bild.eq(0).fadeIn();
titel.eq(0).addClass("aktiv");
beschreibung.eq(0).fadeIn();
});

function allout(bild,beschreibung) {
for (var i=0; i<bild.size(); i++) {
$(".link"+i).removeClass("aktiv");
bild.hide();
}
for (var i=0; i<beschreibung.size(); i++) {
beschreibung.hide();
}
}
