[JS] detectiescrollbar

[Koffie]

Ja .. een rare vraag, waarvan ik mij afvraag of het mogelijk is.
Is er een of andere mogelijkheid om via JS te achterhalen of er een scrollbar in een bepaald frame aanwezig is ja of nee.

Ik bedoel dus, ik heb een frame set, en in een bepaald frame word een pagina geladen.
Ik wil dus in die pagina via JS laten detecten of de hele pagina in 1 keer op het scherm staat, of dat er een scrollbar is om te scrollen.

Ik heb al bij enkel JS sites gekeken, maar niet gevonden.

[drm]

mmm weinig kans... Ik weet iig niet van het bestaan af. Je zou wel na kunnen gaan hoe hoog de tekst is en het window, dan weet je ook oftie moet scrollen...

[RM-rf]

wat je kundoen is een div om alle content heenzetten, hiervan de hoogte opvragen en die vergelijken met window.innerHeight; als de totale grootte langer is kan je ervanuitgaan dat er een scrollbar is.

ik gebruik in een scriptje ergens het omgekeerde principe, om juist customized scrollknoppen te laten verschijnen, kan dat zo even opzoeken, maar dacht dat het met bovenstaand principe werkte

edit:
eventueel zou je hiernaar kunnen kijken:
http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/contentOverflow.asp
betwijfel of het goed werkt, het lijkt me zo op oppervlakkige blik juist een optie van xml-styles
ook is het een propertie van een event, maar het staat wel onder webdev op msdn dus je zou het kunnen testen in msie5/pc, voor netscape/moz en msie/mac zal je wel de andere methode moeten toepassen

[Bosmonster]

de body is toch al een div om je content heen?

je kunt de hoogte van de body opvragen (jammergenoeg werkt dit niet in NS4) en die vergelijken met window.innerWidth. Voglens mij ging dat met body.scrollHeight ofzo?

[Hangloozz]

Bosmonster: zit hier de door jouw gewenste property niet bij:

code:

window.innerWidth
document.body.clientWidth

window.innerHeight
document.body.clientHeight

document.width
document.body.scrollWidth

document.height
document.body.scrollHeight

window.pageXOffset
document.body.scrollLeft

window.pageYOffset
document.body.scrollTop

zijn zo even de varianten op het thema "meten is weten"

[Koffie]

Hmmzz .. toch niet helemaal wat ik zoek (of ik doe het verkeerd).

Ik heb dus een frameset.
Boven zitten over de hele breedte 2 kleine frames. Vervolgens is er linx een menu, en het grootste rechtergedeelte is het menu.

Nu is het zo dat ik standaard mijn HTML pagina's langer maak dan nodig is. dit om ervoor te zrogen dat er een scollbar komt.

Dit, vanwege de opmaak van mijn standaard HTML pagina's.
Er mist namelijk een aantal stukken is ik niet een aantal <BR> er in forceer.

Nu is dus mijn bedoeling om op de een of andere manier te detecteren of er een scrollbar aanwezig is (lees: past de HTML in 1x erop, of moet er naar beneden gescrolld worden).

Indien er gescrold word is alles OK. Is het niet zo, dan moeten er dus via JS een aantal xtra regels toegevoegd worden.

Nu kan ik het allemaal relatief statisch met JS doen, maar dan kun je dus voor ELKE resolutie een script maken, en dan nog pak je niet de exotische reso's of de mensen die in kiosk mode of F11 mode aan het surfen zijn.

Misschien dat ik iets aan het script van RM-rf heb, als je deze met me zou willen delen graag

Alvast bedankt.

[RM-rf]

Op dinsdag 23 oktober 2001 11:15 schreef Koffie het volgende:
Misschien dat ik iets aan het script van RM-rf heb, als je deze met me zou willen delen graag

hier komt ie, notice de tiepfout: scollbody ipv scrollbody ( mijn god, ik moet toch eens wat zorgvuldiger werken )

code:

function scrollbody() 
{
   sb = document .getElementById('scrollbody')
   sbF = document.getElementById('scollBodyFull')
   stop = document.getElementById('scrollTop')
   sbtm = document.getElementById('scrollBottom')
    if (sbF) 
    {       
       scrollBodyHeight = sbF.offsetHeight
       scrollBodyTop = sb.offsetTop
       bodyHeight =  document.body.clientHeight
       availScrollheight = bodyHeight-scrollBodyTop
       if (scrollBodyHeight > availScrollheight)
       {
        sbF.style.overflow = "hidden"
        sb.style.height=(st.style.display == "block")?availScrollheight-18:availScrollheight-36
        stop.style.display = "block"    
        sbtm.style.display = "block"    
       } else {
        sb.style.overflow = "visible"
        stop.style.display = "none" 
        sbtm.style.display = "none"
      }
    }
}

in zekere zin doe ik daarmee wat heel anders, ik heb een divje met clipping (scrollBody) die bevat een lange div(scollBodyFull)
zodra de content langer is dan de beschikbare ruimte verschijnen bovenin twee scrollvlakken.

de crux lijkt hem te zitten in

code:

bodyHeight =  document.body.clientHeight
availScrollheight = bodyHeight-scrollBodyTop
if (scrollBodyHeight > availScrollheight)

die > omzetten naar < is eigenlijk al een check of je content-layer groter is dan de viewport

document.body.clientHeight retourneert namelijk niet de hoogte van de body, maar de 'viewport', de hoogte van je venster op de pagina.

[Koffie]

Pfff .... echt heel veel wijzer wordt ik er niet van.
Ben niet zo'n geweldige scripter.
Ik had eigenlijk gedacht dit script in werking te vinden op je homepage (huisje), maar niet gevonden.

HEb je 'm ergens online zodat ik even kan kijken hoe en wat?

* Koffie beseft dattie nu wel heel erg veel vraagt, maar is niet zo heel erg ged in scripting enzo.

[Koffie]

Ok... na lang puzzelen ben k er dan toch nog achter gekomen.

knal dus alles zoals het hoort tussen <body> en </body>.
Als laatste vóór </body> plak je dus het volgende:

code:

<script language="JavaScript">
 document.write('body is: ')
 document.write(document.body.clientHeight)
 document.write(' scroll is: ')
 document.write(document.body.scrollHeight)
avail = document.body.clientHeight - document.body.scrollHeight

if (avail == 0) {
document.write('  Er is geen scrollbar, alles is OK') ;
}

if (avail < 0) {
document.write('  Er is een scrollbar') ;
}

if (avail > 0) {
document.write('  Er is geen scrollbar, je window is groter dan je HTML') ;
}
</script