Hét vraag- en antwoordplatform van Nederland

Hoe kan ik in HTML/CSS de verticale scrollbar bij een paneel weghalen?

In de bijlage is goed te zien wat ik bedoel, de scrollbar waar de pijl op wijst, wil ik graag weg hebben, maar hoe doe ik dat? Ik bedoel dus niet van de hele pagina want dat doe je met "body { overflow-y: hidden; }".

Alvast bedankt :)

Verwijderde gebruiker
10 jaar geleden
2.9K

Heb je meer informatie nodig om de vraag te beantwoorden? Reageer dan hier.

Antwoorden (1)

Dag Elf,
Dit is de code die jij op dit moment voor je chat element hebt gebruikt:

Door die overflow:scroll; daar te definiëren zul je dus standaard een scroll-balk krijgen in de meeste browsers.
Om je toch een oplossing te kunnen bieden zal ik even twee aannames moeten doen:
1. Je wilt de overflow wel scrollbaar houden maar geen scrollbar kunnen zien.
2. Je hebt deze website zoals ik die hier zie niet bedoeld voor mobiele telefoons.

Er zijn verschillende mogelijkheden voor het stylen van scroll-bars, Hier vindt je bijvoorbeeld een leuke: http://stackoverflow.com/questions/3296644/hiding-the-scrollbar-on-an-html-page#answer-17627015 die er voor zorgt dat de scrollbar alleen verschijnt op het moment dat hij ook echt nodig is. (Als er iets te scrollen valt)
En hier is een ontzettend uitgebreide site over dit onderwerp die ver gaat maar ook aantoont dat het vrijwel onmogelijk is om dit in alle browsers voor elkaar te krijgen: http://xeemez.blogspot.nl/2013/09/changing-style-of-scrollbar-with-css.html

Maar voor een scroll-bar op een element ken ik er echt geen één die volledig crossbrowser is, tenzij je de scroll-bar volledig disabled en het scrollen gaat invoegen door middel van jquery of javascript. Zoals bijvoorbeeld met jscrollpane: http://jscrollpane.kelvinluck.com/

Zelf hou ik niet van jquery, en javascript gebruik ik alleen als het niet anders kan.
Wat ik zou doen in jouw geval is ook veel simpeler:
Bedek de scrollbar met een div-je met dezelfde donkere achtergrondkleur. (De gradients moet je er dan even in shoppen natuurlijk.

Let op de z-index waarde van de elementen, en op de positionering tijdens responsive weergave van je site.

Het klinkt als valsspelen, maar dat is het niet hoor. En je bereikt er precies datgene mee dat je wilt bereiken. Hier nog een voorbeeldje waarin ik het afdek element een gele border heb gegeven zodat ie wat meer opvalt.

http://jsfiddle.net/mq6Pz/1/

Succes!

Toegevoegd na 3 minuten:
Ik ben trouwens wel heel benieuwd waarmee je je site gebouwd hebt...

Toegevoegd na 7 minuten:
Oh ik zie het al: http://www.ihostinghq.com/
Kun je daarbij aanpassingen maken in de broncode? Dat is leuk om te onthouden!
(Lees meer...)
Verwijderde gebruiker
10 jaar geleden

Weet jij het beter..?

Het is niet mogelijk om je eigen vraag te beantwoorden Je mag slechts 1 keer antwoord geven op een vraag Je hebt vandaag al antwoorden gegeven. Morgen mag je opnieuw maximaal antwoorden geven.

0 / 5000
Gekozen afbeelding