Scrollbar in iOS ausblenden

    Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

    • Scrollbar in iOS ausblenden

      Kurz und knapp,
      in Euren Apps wird vermutlich die Scrollbar angezeigt die Systemseitig auf Webseiten eingebunden wird. Das verhindert meiner Meinung nach das native Feeling einer App. Deshalb einfach folgenden Befehl nutzen, und die Scrollbar so los werden:

      Quellcode

      1. ::-webkit-scrollbar {
      2. display: none;
      3. }
    • Oder ihr passt die Scrollbar an.

      Quellcode

      1. ::-webkit-scrollbar {
      2. width: 12px;
      3. background: rgba(100,100,100,0.5);
      4. }
      5. ::-webkit-scrollbar-track {
      6. -webkit-box-shadow: inset 0px 0px 3px rgba(0,0,0,0.5);
      7. -webkit-border-radius: 6px;
      8. border-radius: 6px;
      9. }
      10. ::-webkit-scrollbar-thumb {
      11. -webkit-border-radius: 6px;
      12. border-radius: 6px;
      13. background: rgba(200,200,200,0.5);
      14. -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,0.5);
      15. }
      16. ::-webkit-scrollbar-thumb:window-inactive {
      17. background: rgba(200,200,200,0.2);
      18. }
      Alles anzeigen

      So passt passt man auch die hässlichen Scrollbars in Chrome unter Windows an. Damit sie unter Windows und iOS identisch aussehen.
    • Nein sicher nicht :D Ist nur ein Beispiel Design von mir. Angelehnt an iOS. Und wirklich nur mit webkit kompatibel. Also z.B. iOS und Chrome. Firefox ermöglicht diese Gestaltung aber auch. Sieht dann nur etwas anders aus. Und ist natürlich mit der ein oder anderen Beschränkung behaftet. Müsste man sich mal im Netz zusammensuchen.
      Auf die Schnelle habe ich das hier gefunden.

      So sieht mein Beispiel aus. (Code)
      (Der Hintergrund stammt vom body im dunklen style)

      Dieser Beitrag wurde bereits 2 mal editiert, zuletzt von Appartig ()