Kolommen naast elkaar bij breed beeld, onder elkaar bij klein beeld
Ik wil graag optimaal gebruik maken van het scherm. Wanneer iemand gebruik maakt van breedbeeld (of een breed genoeg beeld) dan wil ik 2 of meerdere kolommen naast elkaar tonen. Bijvoorbeeld voor een formulier.
Wanneer iemand op een kleiner scherm werkt, of de browser wat kleiner maakt, dan wil ik dat de meest rechter kolom naar onder verhuist.
Is zoiets mogelijk?
Groet,
Op verzoek van TS naam en eventuele contact gegevens verwijderd.[/modedit]
Gewijzigd op 06/08/2013 18:08:58 door Bas IJzelendoorn
<script>
if(screen.availWidth < 1280){//als schermresolutie kleiner is als 1280pixels
//ligt aan toepassing wat voor code hier komt
}
</script>
Je zou in een formulier ook zoiets kunnen zetten:
Code (php)
1
2
3
2
3
<form action="..." onsubmit="breedte.value=screen.availWidth">
<input type="hidden" name="breedte" value="" />
</form>
<input type="hidden" name="breedte" value="" />
</form>
En op de server kun je dan uitrekenen hoeveel kolommen je kunt hebben.
Je neemt 2 div's met een vaste breedte en geeft die een float: left; mee.
Zodra er genoeg ruimte is, komen de 2 div's naast elkaar.
Zodra er geen ruimte voor is, komen ze onder elkaar aan de linkerkant van het scherm.
Zo is je probleem opgelost denk ik?
Flugeltje89 schreef op 30.01.2010 15:38:
Dat kan ook zonder javascript.
Je neemt 2 div's met een vaste breedte en geeft die een float: left; mee.
Zodra er genoeg ruimte is, komen de 2 div's naast elkaar.
Zodra er geen ruimte voor is, komen ze onder elkaar aan de linkerkant van het scherm.
Zo is je probleem opgelost denk ik?
Je neemt 2 div's met een vaste breedte en geeft die een float: left; mee.
Zodra er genoeg ruimte is, komen de 2 div's naast elkaar.
Zodra er geen ruimte voor is, komen ze onder elkaar aan de linkerkant van het scherm.
Zo is je probleem opgelost denk ik?
Ja!
**** schreef op 30.01.2010 15:39:
Dat ziet er mooi uit. Alleen wil ik het graag dynamisch hebben. Wanneer iemand een resize doet van z'n browser bijvoorbeeld, wil ik zo lang mogelijk uitstellen dat er een horizontale scrollbar komt.
Dat kan wel, maar ik snap er de bedoeling niet helemaal van.
Niemand krijg in principe een horizontale scrollbar, alleen als ze een scherm van 800x600 hebben en de breedte van jou div, meer is als 800px.
Als je zorgt dat jou div een breedte heeft van 780px, dan krijgt niemand een horizontale scrollbar, alleen als je je browser achterlijk klein gaat resizen, wat niemand doet.
Met 2 div's naast elkaar van elk 780px breed, kom je al op een breedte van 1560px, wat behoorlijk breed is.
De meeste mensen hebben geen scherm meer van 800x600, dus je kunt ook een grootte aanhouden van 1000px, wat neerkomt op een totale breedte van 200px. Dat is op een groot scherm goed te doen en op een normaal scherm is dat evengoed nog te zien zonder horizontale scrollbalk.
Ik hoop dat het duidelijk over komt, anders hoor ik het wel.
Gewijzigd op 06/08/2013 18:09:22 door Bas IJzelendoorn
yorick17 schreef op 30.01.2010 15:56:
800x600 uhh, ja ik heb er nog een!
Ga met de tijd mee ;). De meeste websites ondersteunen dat niet meer, net als Internet Explorer 6.