11 svar · 441 visningar · startad av Moonman
Halo.
Tänk er en ruta. Dela sedan rutan vertikalt på mitten så att vi har två spalter. Dela sedan den högra spalten horisontelt så att vi totalt har tre rutor.
Jag skulle vilja att en scroll kom upp till höger om alla rutor men bara påverkar den vänstra spalten, de två mindre rutorna ska ligga kvar.
Hur gör jag detta?
mvh Alex Robsahm
Nej det har jag inte. Är det svårt att visualisera det jag frågar om? Jag behöver inte få kod tillbaka heller utan det räcker om någon kan säga vilka tekniker man ska använda och hur man ska tänka.
mvh Alex Robsahm
Nej, jag förstår hur du tänkt att det visuellt skall se ut. Är det <iframe>:s inblandade eller är det enbart <div>-element det är frågan om?
:)
<html>
<head>
<style>
.pa {position: absolute; border: 1px solid black;}
</style>
</head>
<body style="overflow: hidden;" scroll="no">
<div style="overflow: auto; left: 0px; top: 0px; height: 100%; width: 50%;" class="pa">
Vänster
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
</div>
<div style="overflow: hidden; left: 50%; top: 0px; height: 50%; width: 50%;" class="pa">
Uppe till höger
</div>
<div style="overflow: hidden; left: 50%; top: 50%; height: 50%; width: 50%;" class="pa">
Nere till höger
</div>
</body>
</html>
:)
EDIT: Ändrade koden lite för tydlighetens skull.
Kan du förklara vad det är i koden som gör att scrollen hamnar till höger om allt för jag kan inte hitta det.
mvh Alex Robsahm
Den hamnar inte längst till höger... Men det där är det närmaste man kan komma utan att krångla till det alltför mycket.
Jeg vet redan hur man gör det du beskrev men det är inte vad jag söker, tack iaf.
mvh Alex Robsahm
<html>
<head>
<style>
.pf {[b]position: fixed;[/b] border: 1px solid black;}
</style>
</head>
<body>
Vänster
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<div style="overflow: hidden; left: 50%; top: 0px; height: 50%; width: 50%;" class="pf">
Uppe till höger
</div>
<div style="overflow: hidden; left: 50%; top: 50%; height: 50%; width: 50%;" class="pf">
Nere till höger
</div>
</body>
</html>
Alternativet är position: fixed; på lagren, som gör det du vill. Kruxet är att det inte funkar i någon version av IE. (Bara mozilla och Opera)