Unsichtbare Scroll-Bar

[Pixel-Wizard]

Hallo zusammen

Ich habe mit

overflow: scroll

ein Scroll-Div erschaffen. Die Scrollbar braucht aber recht viel Platz, da das Div relativ klein ist.

Wie schaffe ich es nun dass die Scroll-Bar unsichtbar wird?

Liebe Grüsse
Pixel-Wizard

 

[Cheffchen]

Hallo,

das geht so ganz einfach nicht da etwas unlogisch.
Kannst es aber mit Javascript versuchen, per css overflow:hidden also einfach abschneiden aber dann per javascript scrollbar machen.
Is so natürlich auch eine fehlerquelle das die auch mal nicht so funktioniert und wichtige sachen so nicht angezeigt werden können.

Cheffchen

 

[Pixel-Wizard]

Gibt es da keine einfachere Lösung?

 

[Banana_Jones]

Nein.

Die Scrollbar gehört zum Browser, nicht zur Website, deswegen kann man diese nicht ohne weiteres anpassen. Für den IE gibt es die Möglichkeit, die Farben der Scrollbar anzupassen, nicht aber die Breite. (SELFHTML: Stylesheets / CSS-Eigenschaften / Anzeigefenster)

Für jQuery gibt es div. PlugIns, die die Scrollbar verstecken und eine eigene anzeigen.

 

[Pixel-Wizard]

Es ist möglich die Scrollbar anzuzeigen lassen oder nicht (overflow: hidden || overflow: scroll). Wieso ist es dann nicht möglich einen Hybrid daraus zu machen? Die Scrollbar wird nicht angezeigt aber es kann trotzdem gescrollt werden. Da muss es doch einfach ein Lösung geben...

 

[Cheffchen]

Hallo,

wieso kann man nicht in ein Benziener das Billigere Diesel machen, der Diesel fährt doch auch mit Diesel :O).

Mit jquery geht das wie wir schon gesagt haben, aber ob damit die Besucher glücklich machst, sag ich mal nichts.
Edit this Fiddle - jsFiddle

Einfacher geht nicht.

Cheffchen

 

[omoxen]

nimm 2 divs und setzte beim äußeren overflow auf hidden. Das innere machst du dann so um die 10px breiter als das äußere, sodass die Scrollleiste gerade nicht mehr sichtbar ist, da sie ja vom äußeren div überdeckt wird.
Evtl kannst du ja beim Hovern das äußere div wieder größer machen, damit man die Scrollleiste doch noch sieht.

 

[threadi]

Diese Lösung setzt voraus, dass alle Browser eine maximal 10 Pixel breite Scrollbar anzeigen. Das ist jedoch gerade angesichts unterschiedlicher Oberflächen von Betriebssystemen eher utopisch.

 

[Matti von Skynethub]

Hallo,

das geht so ganz einfach nicht da etwas unlogisch.
Kannst es aber mit Javascript versuchen, per css overflow:hidden also einfach abschneiden aber dann per javascript scrollbar machen.
Is so natürlich auch eine fehlerquelle das die auch mal nicht so funktioniert und wichtige sachen so nicht angezeigt werden können.

Cheffchen

Natürlich geht das einfach : wenn du z.b. auf deinem Sidebar CSS einen
overflow-y: auto für eine Scroll Bar hast kannst du darunter folgendes hinzufügen um sie auszublenden:

.sidebar::-webkit-scrollbar { width: 0; height: 0;} (Scrollbalken ausblenden für Firefox)

.sidebar { scrollbar-width: none; (für Firefox )
.sidebar { -ms-overflow-style: none; ( für alte Edge-Versionen )

Ich würde empfehlen alle elemente hinzuzufügen damit die Scroll bar auf jedem Browser unsichtbar ist.

 

[msi]

@Matti von Skynethub
Der Thread ist vom 19. April 2013, ich glaube kaum, dass das Thema noch relevant ist.

 

[Matti von Skynethub]

@Matti von Skynethub
Der Thread ist vom 19. April 2013, ich glaube kaum, dass das Thema noch relevant ist.

Ich dachte falls jemand mit ähnlichen Problemen kommt kann er sich den Comment durchlesen und es bei sich nutzen.