[html] Met één srollbar meerdere frames scrollen - Softwareontwikkeling

vrijdag 1 november 2002 19:23

Acties:

Smeert smeuïg tot...

Topicstarter

Is het mogelijk om met één scrollbar alle frames in een pagina te verschuiven?
Dus:
1 frame wordt langer, normaal komt er dan direct een scrollbar naast aan de rechtekant van het frame. Maar nu wil ik die scrollbar aan de rechterkant van het scherm van explorer, zodat je het hele scherm scrolled ipv. alleen dat frame.

En hoe is dat mogelijk? Ik dacht zelf door de hele pagina in een ander frame te stoppen..maar dat was mislukt

"Luie mensen worden ook moe!"

vrijdag 1 november 2002 19:28

Acties:

odysseus

Debian GNU/Linux Sid

Ik ken geen manier om zoiets te doen. Je zou je pagina wel met tables of CSS kunnen ombouwen zodat het er hetzelfde uitziet maar wel slechts één scrollbar krijgt, maar dat is waarschijnlijk niet helemaal wat je wilt

.

Leven is het meervoud van lef | In order to make an apple pie from scratch, you must first create the universe.

vrijdag 1 november 2002 19:36

Acties:

Verwijderd

Als je alles wilt laten bewegen waarom gebruik je dan frames? Dat is nu juist het doel van frames, dat bepaalde delen niet meescrollen (een van de doelen dan

)...

Gewoon die zooi in een tabelletje gooien (misschien Dreamweaver of iets dergelijks proberen?), dan heb je denk ik wat je wilt bereiken...

Succes

vrijdag 1 november 2002 21:05

Acties:

Cubix

Verwijderd schreef op 01 november 2002 @ 19:36:
Als je alles wilt laten bewegen waarom gebruik je dan frames? Dat is nu juist het doel van frames, dat bepaalde delen niet meescrollen (een van de doelen dan )...

Gewoon die zooi in een tabelletje gooien (misschien Dreamweaver of iets dergelijks proberen?), dan heb je denk ik wat je wilt bereiken...

Succes

Dat komt omdat we een menubar met flash gaan maken. En wij willen niet dat de hele pagina ververst als er op een link uit die menubar wordt geklikt. En onze kennis reikt alleen tot html en flash.

vrijdag 1 november 2002 21:43

Acties:

Verwijderd

Cubix schreef op 01 november 2002 @ 21:05:
[...]

Dat komt omdat we een menubar met flash gaan maken. En wij willen niet dat de hele pagina ververst als er op een link uit die menubar wordt geklikt. En onze kennis reikt alleen tot html en flash.

Die flash file wordt wel gecached door de browser, om laadtijd hoef je het dus niet te laten.

vrijdag 1 november 2002 21:45

Acties:

pim

Wellicht is het op te lossen door het gebruik van iframes i.p.v. een frameset.

vrijdag 1 november 2002 21:51

Acties:

Gerwin

Ik ben er klaar voor!

Pindkaas schreef op 01 november 2002 @ 19:23:
Is het mogelijk om met één scrollbar alle frames in een pagina te verschuiven?
Dus:
1 frame wordt langer, normaal komt er dan direct een scrollbar naast aan de rechtekant van het frame. Maar nu wil ik die scrollbar aan de rechterkant van het scherm van explorer, zodat je het hele scherm scrolled ipv. alleen dat frame.

En hoe is dat mogelijk? Ik dacht zelf door de hele pagina in een ander frame te stoppen..maar dat was mislukt

Probeer eens uit te leggen wat je met zoiets wilt doen?

 Station van Gerwin Prins op Apple Music

vrijdag 1 november 2002 22:50

Acties:

Cubix

Gerwin schreef op 01 november 2002 @ 21:51:
[...]

Probeer eens uit te leggen wat je met zoiets wilt doen?

Dat heb ik dus gedaan, een paar posts hierboven, ik werk namelijk samen met Pindkaas aan die site.

Verwijderd schreef op 01 november 2002 @ 21:43:
[...]

Die flash file wordt wel gecached door de browser, om laadtijd hoef je het dus niet te laten.

Maar ook al laadt die Flash-file heel snel na een klikje van de user op een link, je kan geen animatie laten doorlopen in die flash-menubar.

vrijdag 1 november 2002 23:04

Acties:

Verwijderd

Misschien hebben jullie hier wat aan:
http://webfx.eae.net/dhtml/syncscroll/syncscroll.html

zaterdag 2 november 2002 22:39

Acties:

Verwijderd

Probeer het eens met DHTML:

HTML:

<html>
<body>
<div style="width:100%;height:50%;overflow:auto">Pagina 1</div>
<div style="width:100%;height:50%;overflow:auto">Pagina 2</div>
</body>
</html>

Hier werk je niet met frames, maar gedeeltes op een pagina die een scrollbalk hebben.

zaterdag 2 november 2002 22:45

Acties:

FlowDesign

of in hun geval waarschijnlijk dit:

HTML:

<html>
<body>
<div style="width:20%;height:100%;overflow:auto">menubar_link</div>
<div style="width:80%;height:100%;overflow:auto">mainpage_rechts</div>
</body>
</html>

Of kan dit weer niet?

Maar ehm, laat eens iets zien wat jullie tot nu toe hebben, dan komen de (goede) ideeën wel vanzelf boven drijven...

[ Voor 0% gewijzigd door FlowDesign op 02-11-2002 22:46 . Reden: typo ]

Mustang Mach-E SR RWD | MINI Countryman (F60) Cooper S (Stage 1 tuned)

zaterdag 2 november 2002 22:54

Acties:

Cubix

Het zijn allemaal mooie technieken, bedankt voor de tips, maar als ik jullie goed begrijp hebben jullie niet door wat we willen.

We willen in een html site maken die een menu bevat die met flash gemaakt is. Nu is het probleem als je maar één frame (dus eigenlijk géén frames gebruikt) gebruikt dat het flash menu zelf ook opnieuw wordt geladen als er op een link binnen dat flashmenu wordt geklikt.
En als er op dat moment net een animatie bezig is in die flash menubar wordt die ruwweg gestopt op het hele zooitje opnieuw te laden. Ook al gaat dat heel snel, de timeline wordt niet hervat.

We willen dus hetzelfde idee gebruiken als de frontpage van Tweakers.net, dus met één scrollbar helemaal links, maar dan met een flash menu.

zondag 3 november 2002 00:35

Acties:

Verwijderd

Er vanuit gaande dat het flash-menu in het linker-frame zit: waarom willen jullie dat dat meescrollt? Het voornaamste resultaat lijkt me dat je navigatie uit beeld verdwijnt...

Maar als het dan toch per se moet dan gaan mijn gedachten uit naar zoiets:

1. linkerframe bevat flash menu in een div die de hoogte van het frame bepaalt. Scrolbar moet verborgen blijven, scrolling=no of iets met css (overflow hidden).
2. Als rechterframe geladen wordt, wordt er een functie uitgevoerd die zorgt dat de div in het linkerframe zo ge-resized wordt dat dat frame even hoog is als het rechterframe. Het rechterframe heeft wel een scrollbar.
3. Er dient een functie te zijn die de positie van het linkerframe koppelt aan die van het rechterframe. Welke event-handler daar het best voor gebruikt kan worden zou ik zo ook niet 1,2,3 kunnen zeggen.

maar ja, dit ziet er vrij omslachtig uit. Beetje een botte-bijl-methode...

edit: ipv het linker frame resizen en scrollen kun je daar ook een div in heen en weer laten bewegen...

[ Voor 0% gewijzigd door Verwijderd op 03-11-2002 10:18 . Reden: ... ]

zondag 3 november 2002 12:15

Acties:

Cubix

Verwijderd schreef op 03 november 2002 @ 00:35:
Er vanuit gaande dat het flash-menu in het linker-frame zit: waarom willen jullie dat dat meescrollt? Het voornaamste resultaat lijkt me dat je navigatie uit beeld verdwijnt...

Maar als het dan toch per se moet dan gaan mijn gedachten uit naar zoiets:

1. linkerframe bevat flash menu in een div die de hoogte van het frame bepaalt. Scrolbar moet verborgen blijven, scrolling=no of iets met css (overflow hidden).
2. Als rechterframe geladen wordt, wordt er een functie uitgevoerd die zorgt dat de div in het linkerframe zo ge-resized wordt dat dat frame even hoog is als het rechterframe. Het rechterframe heeft wel een scrollbar.
3. Er dient een functie te zijn die de positie van het linkerframe koppelt aan die van het rechterframe. Welke event-handler daar het best voor gebruikt kan worden zou ik zo ook niet 1,2,3 kunnen zeggen.

maar ja, dit ziet er vrij omslachtig uit. Beetje een botte-bijl-methode...

edit: ipv het linker frame resizen en scrollen kun je daar ook een div in heen en weer laten bewegen...

Ik had idd wel ff kunnen vertellen waar ik het menu had geplanned. Ik wil het menu graag bovenaan de pagina hebben, net zoals op de frontpage (alleen zonders links aan de linkerkant). Zo moet de site ook werken. Alleen het menu moet dus met flash worden gemaakt.

Afbeeldingslocatie: http://members.chello.nl/m.dewachter/tweakers/site.gif

Afbeeldingslocatie: http://members.chello.nl/m.dewachter/tweakers/site.gif

Maar iig zeer bedankt voor de genomen moeite!

[ Voor 0% gewijzigd door Cubix op 03-11-2002 12:20 . Reden: Plaatje toevoegen ]

zondag 3 november 2002 13:40

Acties:

Morrar

Heb ff nagedacht over een IE methode. NS wordt wat lastiger, en daar had ik ff geen tijd voor. Iets waar je ook op moet letten bij NS is dat als je scrolling=no in een frame zet hij ook niet meer met JS wil scrollen, doe dus overflow: hidden met een CSS voor NS.

Ok een snel geknutselde IE methode, heb niet getest maar hoop dat het werkt:

Stel:
Menuframe-naam: "MenuFrame";
Contentframe-naam: "ContentFrame";

JavaScript:

In menu-frame:

bLoaded = 0;

//Zorg ervoor dat menupagina even lang is als content
function SyncHeights()
{  //ff kijken of alles geladen is
    if(!top.frames ||
       !top.frames.ContentFrame ||
       !top.frames.ContentFrame.document ||
       !top.frames.ContentFrame.document.body)
    { self.setTimeout("SyncHeights();", 500); } //Nee? later weer proberen
    else
    {  document.getElementById("menudiv").style.height = top.frames.ContentFrame.document.body.scrollHeight;
        bLoaded = 1; 
    }
}

En dan de html:
<body onLoad="SyncHeights();" style="overflow: hidden; margin: 0px;">
<div id="menudiv">
<!-- Menu flash hierzo -->
</div>
</body>


In content-frame:

function StartSync()
{  document.body.onscroll = SyncScroll;
}

//Zorg ervoor dat pagina's tegelijk scrollen als de hoogtes gelijk zijn gemaakt
function SyncScroll()
{  //ff kijken of alles geladen is
    if(top.frames &&
       top.frames.MenuFrame &&
       top.frames.MenuFrame.bLoaded) //Ja? ok gaan dan
    {  top.frames.MenuFrame.scrollTo(document.body.scrollLeft, document.body.scrollTop);
    }
    //anders pech gehad....
}

En dan met <body onload="StartSync();"> starten

Zal het nog ff testen dit, want is toch wat meer code dan verwacht... Zet er zo wel bij of het werkte hier

Suc6

edit:
Zo als het nu staat werkt het... Alleen heb je dus die <div> nodig om de pagina op te rekken. Je kan de body anders niet handig oprekken, dus ach... Evt margins die je in de <body> had moeten in de <div> nu, als padding... Vind het niet zo netjes zo, maar hoop dat je er wat mee kan.

zondag 3 november 2002 18:26

Acties:

Verwijderd

Volgens mij is dit een kwestie van een verkeerd uitgangspunt. Als je nou eens een menu bouwt in html. Dan hoef je ook geen frames te gebruiken en zijn er weer twee kwaden de wereld uit.

zondag 3 november 2002 20:11

Acties:

Cubix

Morrar schreef op 03 november 2002 @ 13:40:
Heb ff nagedacht over een IE methode. NS wordt wat lastiger, en daar had ik ff geen tijd voor. Iets waar je ook op moet letten bij NS is dat als je scrolling=no in een frame zet hij ook niet meer met JS wil scrollen, doe dus overflow: hidden met een CSS voor NS.

Ok een snel geknutselde IE methode, heb niet getest maar hoop dat het werkt:

Stel:
Menuframe-naam: "MenuFrame";
Contentframe-naam: "ContentFrame";
JavaScript:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
In menu-frame:

bLoaded = 0;

//Zorg ervoor dat menupagina even lang is als content
function SyncHeights()
{  //ff kijken of alles geladen is
    if(!top.frames ||
       !top.frames.ContentFrame ||
       !top.frames.ContentFrame.document ||
       !top.frames.ContentFrame.document.body)
    { self.setTimeout("SyncHeights();", 500); } //Nee? later weer proberen
    else
    {  document.getElementById("menudiv").style.height = top.frames.ContentFrame.document.body.scrollHeight;
        bLoaded = 1; 
    }
}

En dan de html:
<body onLoad="SyncHeights();" style="overflow: hidden; margin: 0px;">
<div id="menudiv">

</div>
</body>


In content-frame:

function StartSync()
{  document.body.onscroll = SyncScroll;
}

//Zorg ervoor dat pagina's tegelijk scrollen als de hoogtes gelijk zijn gemaakt
function SyncScroll()
{  //ff kijken of alles geladen is
    if(top.frames &&
       top.frames.MenuFrame &&
       top.frames.MenuFrame.bLoaded) //Ja? ok gaan dan
    {  top.frames.MenuFrame.scrollTo(document.body.scrollLeft, document.body.scrollTop);
    }
    //anders pech gehad....
}

En dan met <body onload="StartSync();"> starten
Zal het nog ff testen dit, want is toch wat meer code dan verwacht... Zet er zo wel bij of het werkte hier

Suc6

edit:
Zo als het nu staat werkt het... Alleen heb je dus die <div> nodig om de pagina op te rekken. Je kan de body anders niet handig oprekken, dus ach... Evt margins die je in de <body> had moeten in de <div> nu, als padding... Vind het niet zo netjes zo, maar hoop dat je er wat mee kan.

Bedankt voor je hulp, ik zal hiermee aan de slag gaan! Ziet er pittiger uit dan ik dacht, maar het gaat wel lukken.