width van div aanpassen op het aantal visibile divs.
Dus met anderen woorden als ik een div open heb dan is de width bijv 100px als er een tweede opend worden deze beide bijv width 70px enz enz.
Nu had ik al bedacht dat ik het aantal divs dat geopend worden moest tellen dat wou ik zo doen:
Code (php)
1
2
2
var $myvar = $(".content:visible").length;
document.write($myvar);
document.write($myvar);
Maar dit werkt al niet maar hoe moet ik het dan doen?
UPDATE
Ik heb het nu deels werkend gekregen:
Code (php)
1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
$('.idboxwrapper').click(function() {
var $aantal = $(".content:visible").length;
var $width = 300 - $aantal*20;
$(this).css( "width", $width );
if( $('.content').is(':hidden') ) {
$(this).find(".content").show(0);
$(this).find(".info").hide(0);
}
});
var $aantal = $(".content:visible").length;
var $width = 300 - $aantal*20;
$(this).css( "width", $width );
if( $('.content').is(':hidden') ) {
$(this).find(".content").show(0);
$(this).find(".info").hide(0);
}
});
Alleen wat ik nu nog mis is dat het script iederen div de zelfde maat geeft. Op dit moment verkleind hij steeds de volgende div weer. En ik wil dat hij zo gauw er een div opend dat alle geopende divs zich verkleinen naar het kleineren formaat.
Gewijzigd op 25/04/2013 14:41:08 door Marco Hendriks
Marco Hendriks op 25/04/2013 14:29:55:
...Alleen wat ik nu nog mis is dat het script iederen div de zelfde maat geeft. Op dit moment verkleind hij steeds de volgende div weer. ...
Ja, dat komt door die $(this).
$(this) betekent: het aangesproken element.
Dus enkel de div waarop geklikt is, krijgt een aangepaste css.
Doe toch gewoon
$(".content:visible").css( "width", $width ); // jouw lijn 5
Of zet in de selector wat je nodig hebt (stel dat ik mis zit).
Gewijzigd op 25/04/2013 14:47:22 door Kris Peeters
UPDATE:
is al opgelost doormiddel van dit stukje code naar boven te plaasten.
Code (php)
1
2
3
4
2
3
4
if( $('.content').is(':hidden') ) {
$(this).find(".content").show(0);
$(this).find(".info").hide(0);
}
$(this).find(".content").show(0);
$(this).find(".info").hide(0);
}
Gewijzigd op 25/04/2013 14:56:11 door Marco Hendriks