tropenberta: scrollbalken

guten morgen leuts

ich hab ein html element mit overflow:scroll. jetzt  hab ich wie gewollt nen scrollbalken.

jetzt will ich noch die höhe des scrollbalken anpassen, möchte aber dazu nicht unbedingt js

dafür verwenden. kann man das nicht irgendwie mit css anpassen ? hab leider nix im google

gefunden, bzw. nur jquery lösungen. ich mein, wenn es nicht anders geht nehm ich es halt, css

wäre mir lieber.

gruss micha

  1. Moin ...

    ich hab ein html element mit overflow:scroll. jetzt  hab ich wie gewollt nen scrollbalken.

    genaugenommen sogar zwei: Einen vertikalen und einen horizontalen.

    jetzt will ich noch die höhe des scrollbalken anpassen, möchte aber dazu nicht unbedingt js dafür verwenden. kann man das nicht irgendwie mit css anpassen ? hab leider nix im google gefunden, bzw. nur jquery lösungen. ich mein, wenn es nicht anders geht nehm ich es halt, css wäre mir lieber.

    Der Scrollbalken erstreckt sich grundsätzlich über die gesamte Höhe bzw. Breite des Elements. Mit CSS kannst du daran nichts ändern, mit Javascript AFAIK auch nicht. Und die "Dicke" des Scrollbalkens wird vom GUI des Systems und dessen Geometrie bestimmt.

    Oder meinst du die Scroll-Position? Die kannst du mit Javascript setzen (scrollTo() bzw. scrollBy() sollten dir da weiterhelfen). CSS bringt nicht auch in diesem Punkt nicht weiter.

    Schönen Sonntag noch,
     Martin

    --
    Wer mit dem Finger droht, sollte ihn am Abzug haben, und nicht in der Nase.
    Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
    1. moin moin martin

      hmm. mist.

      danke für die schnelle antwort.

      kann man dann eventuell die scroll funktion aktiv haben, aber den scrollbalken ausgeblendet haben.

      dir auch nen schönen sonntag.

      gruss micha

      1. moin moin!

        kann man dann eventuell die scroll funktion aktiv haben, aber den scrollbalken ausgeblendet haben.

        Es hat schon einen Grund, warum der "bei Bedarf" normalerweise sichtbar ist.
        Und solange du keinen "besseren" Grund nennen kannst, warum er es nicht sein sollte, solange würde ich von solchen Vorhaben Abstand nehmen (dieses Thema gab und gibt es immer wieder - immer mit demselben Ergebnis). ;-)

        Gruß Gunther

        1. moin gunther

          danke für deine antwort.

          zu dem ergebnis bin ich mittlerweile auch gekommen.

          der grund ist das ich nen scrollbarenbereich hab aber der scrollbalken das design unschöner macht. hab mittlerweile das design an den scrollbalken angepasst und muss wohl damit leben.

          für ie hab ich wenigsten was gefunden um die farbe anzupassen. mein hintergrund ist weiß - hab ich für scrollbar alles weiß vergeben und er ist weg.

            
           scrollbar-3dlight-color: #ffffff;  
           scrollbar-arrow-color: #ffffff;  
           scrollbar-darkshadow-color: #ffffff;  
           scrollbar-face-color: #ffffff;  
           scrollbar-highlight-color: #ffffff;  
           scrollbar-shadow-color: #ffffff;  
           scrollbar-track-color: #ffffff;  
          
          

          wobei ich das wahrscheinlich, nachdem ich mein design angepasst hab, auch weg lassen werde. ohne scrollbar ist nicht ganz klar ob der content scrollbar ist. ist auch doof.

          euch allen einen schönen sonntag.

          gruss
          micha

          1. Moin Micha!

            danke für deine antwort.

            Gerne.

            zu dem ergebnis bin ich mittlerweile auch gekommen.

            der grund ist das ich nen scrollbarenbereich hab aber der scrollbalken das design unschöner macht. hab mittlerweile das design an den scrollbalken angepasst und muss wohl damit leben.

            Dass Scrollbalken (da wo sie notwendig sind) das Design "unschön" machen, ist imho ein weit verbreiteter Irrglaube.
            Vielmehr sind sie ein fester Bestandteil des jeweiligen Browsers, bzw. OS.

            für ie hab ich wenigsten was gefunden um die farbe anzupassen. mein hintergrund ist weiß - hab ich für scrollbar alles weiß vergeben und er ist weg.

            wobei ich das wahrscheinlich, nachdem ich mein design angepasst hab, auch weg lassen werde. ohne scrollbar ist nicht ganz klar ob der content scrollbar ist. ist auch doof.

            Eben!
            Hier gilt:"Form follows function!".

            Das ist bspw. ein "diffiziler" Punkt bei Touchscreens, wo die Scrollbars i.d.R. nur beim Scrollen eingeblendet werden. Weshalb man imho auf der Seite auf Elemente mit scrollbarem Inhalt verzichten sollte, weil dies eben für den User nicht erkennbar ist.

            euch allen einen schönen sonntag.

            Danke, dir auch.

            Gruß Gunther

            1. Hallo!

              Weshalb man imho auf der Seite auf Elemente mit scrollbarem Inhalt verzichten sollte, weil dies eben für den User nicht erkennbar ist.

              Das wiederum könnte man auch durch ein media-query abfangen. Ich gebe dir aber natürlich grundsätzlich recht.

              Übrigens ist das Thema auch abseits von Scrollbalken interessant wenn es darum geht Formular-Elemente zu formatieren. Dort ist es zum Beispiel gängige Praxis die Browser-Vorgaben zu überschreiben. Man muss halt auch einfach oft Design-Vorgaben erfüllen die nicht immer optimal für den Benutzer sind.

              Grüße, Matze

              1. Hallo!

                Weshalb man imho auf der Seite auf Elemente mit scrollbarem Inhalt verzichten sollte, weil dies eben für den User nicht erkennbar ist.

                Das wiederum könnte man auch durch ein media-query abfangen. Ich gebe dir aber natürlich grundsätzlich recht.

                Momentan (noch) nicht. Denn dazu müsstest du per MQs unterscheiden können zwischen Ausgabegeräten, sprich Bildschirmen/ Displays auf denen standardmäßig Scrollbalken permanent angezeigt werden und solchen, bei denen dies nur beim Scrollen der Fall ist. Und das ist aktuell zumindest nicht möglich.

                Gruß Gunther

    2. Moin ...

      Der Scrollbalken erstreckt sich grundsätzlich über die gesamte Höhe bzw. Breite des Elements. Mit CSS kannst du daran nichts ändern, mit Javascript AFAIK auch nicht. Und die "Dicke" des Scrollbalkens wird vom GUI des Systems und dessen Geometrie bestimmt.

      Das stimmt so nicht ganz ... ;-)
      Für Webkit basierte Browser (Chrome vor Blink, Safari) gibt es da Möglichkeiten.
      Siehe: http://css-tricks.com/custom-scrollbars-in-webkit/

      Persönlich halte ich grundsätzlich nichts von solchen "Spielereien".

      Gruß Gunther

      1. Hallo,

        Der Scrollbalken erstreckt sich grundsätzlich über die gesamte Höhe bzw. Breite des Elements. Mit CSS kannst du daran nichts ändern, mit Javascript AFAIK auch nicht. Und die "Dicke" des Scrollbalkens wird vom GUI des Systems und dessen Geometrie bestimmt.
        Das stimmt so nicht ganz ... ;-)
        Für Webkit basierte Browser (Chrome vor Blink, Safari) gibt es da Möglichkeiten.
        Siehe: http://css-tricks.com/custom-scrollbars-in-webkit/

        ah, okay. Das kannte ich noch nicht, aber ich interessiere mich auch nicht besonders für Webkit. Die Anpassung der Scrollbar-Farben, die in dem Artikel eingangs erwähnt wird, ist mir allerdings geläufig - aber die kann man ja in den Browsern, die das unterstützen, leicht unterbinden (und das ist gut so).
        Zumindest von IE, Firefox und Opera weiß ich es - im IE allerdings nur mit dem Umweg über ein User-Stylesheet.

        Persönlich halte ich grundsätzlich nichts von solchen "Spielereien".

        Ja, da kann ich mich anschließen. Bekannte Bedienelemente sollten bitte so bleiben, wie der Nutzer sie gewöhnt ist. Ich halte es weder für erstrebenswert, sie optisch zu verändern, so dass man sie nicht mehr auf Anhieb erkennt, noch die Funktion einzuschränken und dann auf andere Weise nachzubauen.

        Ciao,
         Martin

        --
        Wenn man keine Ahnung hat - einfach mal Fresse halten.
          (Dieter Nuhr, deutscher Kabarettist)
        Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(