Weiter zum Inhalt
  • Home
  • Aktuell
  • Tags
  • 0 Ungelesen 0
  • Kategorien
  • Unreplied
  • Beliebt
  • GitHub
  • Docu
  • Hilfe
Skins
  • Hell
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dunkel
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Standard: (Kein Skin)
  • Kein Skin
Einklappen
ioBroker Logo

Community Forum

donate donate
  1. ioBroker Community Home
  2. Deutsch
  3. Visualisierung
  4. Yahoo Wetter Widget

NEWS

  • Monatsrückblick Januar/Februar 2026 ist online!
    BluefoxB
    Bluefox
    18
    1
    687

  • Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨
    BluefoxB
    Bluefox
    18
    1
    5.8k

  • Neuer Blogbeitrag: Monatsrückblick - Dezember 2025 🎄
    BluefoxB
    Bluefox
    13
    1
    1.5k

Yahoo Wetter Widget

Geplant Angeheftet Gesperrt Verschoben Visualisierung
6 Beiträge 4 Kommentatoren 3.0k Aufrufe
  • Älteste zuerst
  • Neuste zuerst
  • Meiste Stimmen
Antworten
  • In einem neuen Thema antworten
Anmelden zum Antworten
Dieses Thema wurde gelöscht. Nur Nutzer mit entsprechenden Rechten können es sehen.
  • T Offline
    T Offline
    Taf73
    schrieb am zuletzt editiert von
    #1

    Hallo,

    gibt es eine Möglichkeit, das oben genannte Widget transparent erscheinen zu lassen?

    Danke und Grüße

    1 Antwort Letzte Antwort
    0
    • P Offline
      P Offline
      pix
      schrieb am zuletzt editiert von
      #2

      Hallo,

      ja das geht. Du kannst die CSS-Anweisungen aus dem Widget in VIS übersteuern.

      Die CSS-Datei des Widgets ist diese:

      http://IP-VIS:8082/vis/widgets/timeandw … /yahoo.css

      ! ````
      @charset "UTF-8";
      /**

      • Stylesheet: example.css
      • (c) 2011-2012 Zazar Ltd
      • Description: Stylesheet for examples

      **/
      .weatherFeed {
      font-family: Arial, Helvetica, sans-serif;
      font-size: 90%;
      overflow: hidden;
      -webkit-border-radius: 20px;
      -moz-border-radius: 20px;
      border-radius: 20px;
      }
      .weatherFeed a { color: #888; }
      .weatherFeed a:hover {
      color: #000;
      text-decoration: none;
      }
      .weatherItem {
      padding: 0.8em;
      text-align: right;
      }
      .weatherCity { text-transform: uppercase; }
      .weatherTemp {
      font-size: 2.8em;
      font-weight: bold;
      }
      .weatherDesc, .weatherCity, .weatherForecastDay { font-weight: bold; }
      .weatherDesc { margin-bottom: 0.4em; }
      .weatherRange, .weatherWind, .weatherLink, .weatherForecastItem { font-size: 0.8em; }
      .weatherLink, .weatherForecastItem {
      margin-top: 0.5em;
      text-align: left;
      }
      .weatherForecastItem {
      padding: 0.5em 0.5em 0.5em 60px;
      background-color: #000;
      background-position: left center;
      -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
      border-radius: 5px;
      }
      .weatherForecastDay { font-size: 1.1em; }

      ! .odd { background-color: #e8e8fc; }
      .even { background-color: #d4d4e8; }
      ! .day {
      border: 4px solid #555;
      background: #222 url(../img/bg.jpg) repeat-x;
      color: #fff
      }
      .day a { color: #555; }
      ! .night {
      border: 4px solid #555;
      background: #222 url(../img/bg.jpg) repeat-x;
      }
      .night a:hover { color: #fff; }

      Du packst aber diesen Code in den CSS Reiter (Projekt) im VIS Editor:
      

      /* Übersteuerung Weather Widgets */
      .weatherItem, .weatherFeed {
      background-color: transparent !important;
      }

      .weatherForecastItem {
      background-color: red !important; /* default is #000 */
      }

      Die vorletzte Zeile habe ich auch geändert. Dort kann man die einzelnen Vorhersage Felder farblich anpassen. Standard ist schwarz, also __black__ oder __#000__. Habs mal für die Übersicht in rot gestaltet.
       ![261_bildschirmfoto_2017-02-19_um_15.27.24.jpg](/assets/uploads/files/261_bildschirmfoto_2017-02-19_um_15.27.24.jpg) 
      Viel Spass!
      
      Gruß
      
      Pix
      
      EDIT: Muss ich ändern, Moment!
      
      EDIT (19.2.2017 / 15:28 Uhr): Jetzt geht es! :lol:

      ioBroker auf Ubuntu in Proxmox (früher Mac mini (bis OS X 10.12.6 Sierra), VIS via iOS; angeschlossen: Homematic CCU2, Homepilot 1, ConBee II, einige Wemos, Sonos, Unifi CK+Protect, Homekit, Homebridge; KEIN blockly! Github-Profil

      1 Antwort Letzte Antwort
      0
      • T Offline
        T Offline
        Taf73
        schrieb am zuletzt editiert von
        #3

        Hey, vielen Dank, das funktioniert schon mal (fast) super!

        Hab jetzt nur noch im unteren Teil vom Widget ein weißes Feld was ich nicht

        weg bekomme :? !

        ! 945_test.png

        Weißt Du Rat :)?

        Grüße und Danke

        1 Antwort Letzte Antwort
        0
        • R Offline
          R Offline
          radiorichter
          schrieb am zuletzt editiert von
          #4

          Hallo Taf37,

          hast du das weiß wegbekommen?

          Wie kann ich zudem den Rahmen ausblenden bzw schwarz färben?

          Danke!

          1 Antwort Letzte Antwort
          0
          • haselchenH Offline
            haselchenH Offline
            haselchen
            Most Active
            schrieb am zuletzt editiert von
            #5

            Das weisse Feld ist weg, wenn ich das eingebe:
            3723_unbenannt4.png

            Synology DS218+ & 2 x Fujitsu Esprimo (VM/Container) + FritzBox7590 + 2 AVM 3000 Repeater & Homematic & HUE & Osram & Xiaomi, NPM 10.9.4, Nodejs 22.21.0 ,JS Controller 7.0.7 ,Admin 7.7.19

            1 Antwort Letzte Antwort
            0
            • haselchenH Offline
              haselchenH Offline
              haselchen
              Most Active
              schrieb am zuletzt editiert von
              #6

              So sieht es dann ganz transparent aus (die Ränder stören mich nicht)

              Gibt man bei CSS Ränder noch bei Color auch transparent ein verschwindet der blaue Rahmen.
              3723_unbenannt5.png

              Synology DS218+ & 2 x Fujitsu Esprimo (VM/Container) + FritzBox7590 + 2 AVM 3000 Repeater & Homematic & HUE & Osram & Xiaomi, NPM 10.9.4, Nodejs 22.21.0 ,JS Controller 7.0.7 ,Admin 7.7.19

              1 Antwort Letzte Antwort
              0

              Hey! Du scheinst an dieser Unterhaltung interessiert zu sein, hast aber noch kein Konto.

              Hast du es satt, bei jedem Besuch durch die gleichen Beiträge zu scrollen? Wenn du dich für ein Konto anmeldest, kommst du immer genau dorthin zurück, wo du zuvor warst, und kannst dich über neue Antworten benachrichtigen lassen (entweder per E-Mail oder Push-Benachrichtigung). Du kannst auch Lesezeichen speichern und Beiträge positiv bewerten, um anderen Community-Mitgliedern deine Wertschätzung zu zeigen.

              Mit deinem Input könnte dieser Beitrag noch besser werden 💗

              Registrieren Anmelden
              Antworten
              • In einem neuen Thema antworten
              Anmelden zum Antworten
              • Älteste zuerst
              • Neuste zuerst
              • Meiste Stimmen


              Support us

              ioBroker
              Community Adapters
              Donate

              543

              Online

              32.7k

              Benutzer

              82.6k

              Themen

              1.3m

              Beiträge
              Community
              Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen | Einwilligungseinstellungen
              ioBroker Community 2014-2025
              logo
              • Anmelden

              • Du hast noch kein Konto? Registrieren

              • Anmelden oder registrieren, um zu suchen
              • Erster Beitrag
                Letzter Beitrag
              0
              • Home
              • Aktuell
              • Tags
              • Ungelesen 0
              • Kategorien
              • Unreplied
              • Beliebt
              • GitHub
              • Docu
              • Hilfe