Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. [HowTo] Material Design: Transparentes Slider-Widget, eigener Hintergrund

    NEWS

    • Neuer Blog: Fotos und Eindrücke aus Solingen

    • ioBroker@Smart Living Forum Solingen, 14.06. - Agenda added

    • ioBroker goes Matter ... Matter Adapter in Stable

    [HowTo] Material Design: Transparentes Slider-Widget, eigener Hintergrund

    This topic has been deleted. Only users with topic management privileges can see it.
    • Uhula
      Uhula last edited by

      <size size="150">[HowTo] Material Design: Transparentes Slider-Widget, eigener Hintergrund</size>

      Wird dem Slider-Widget die CSS-Klasse mdui-transparent-acc zugewiesen, so wird nur das Slider-Handle (der Anfasser) gezeichnet, der Slider-Weg ist transparent. Dieses ermöglicht einen individuellen Slider-Hintergrund, z.B. um eine Farbauswahl, Helligkeit usw darstellen zu können.
      3336_slider-transparent.png
      Beispiele für Hintergründe (jeweils ein eigenes basic-HTML hinter dem Slider mit background-Eigenschaft):

      ! ````
      Helligkeit: linear-gradient(to right, #404040, #ffffff)
      Farbtemperatur: linear-gradient(to right, #FFFF80, #E0E0FF)
      Sättigung: linear-gradient(to right, white, blue)
      Farbton: inear-gradient(to right, #ff0000, #ffff00, #00ff00, #00ffff, #0000ff, #ff00ff)

      Eine detaillierte Beschreibung: [https://github.com/Uhula/ioBroker-Mater … eitung.pdf](https://github.com/Uhula/ioBroker-Material-Design-Style/blob/master/docs/anleitung.pdf)
      
      ioBroker.vis Demo-Projekt: [https://github.com/Uhula/ioBroker-Mater … 20projects](https://github.com/Uhula/ioBroker-Material-Design-Style/tree/master/ioBroker%20projects)
      
      __Hinweis: Da hierbei die CSS-Klassen und Javascript-Code des Material Designs benutzt werden, funktioniert es nur dort. CSS und JS müssen dazu aus dem aktuellen MD_Demo Projekt übernommen werden.__
      1 Reply Last reply Reply Quote 0
      • First post
        Last post

      Support us

      ioBroker
      Community Adapters
      Donate

      441
      Online

      31.8k
      Users

      79.9k
      Topics

      1.3m
      Posts

      1
      1
      3156
      Loading More Posts
      • Oldest to Newest
      • Newest to Oldest
      • Most Votes
      Reply
      • Reply as topic
      Log in to reply
      Community
      Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
      The ioBroker Community 2014-2023
      logo