Ankündigung

Einklappen
Keine Ankündigung bisher.

Device shutter: Breite der Grafik anpassbar?

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

    Device shutter: Breite der Grafik anpassbar?

    Hallo,

    ich probiere mich gerade an der Visu für meinen Neubau.
    Da wir im Wohnzimmer eine breite Hebe-Schiebetür bekommen und sonst im Haus normale Fenster und bodentiefe Fenster mischen wollte ich fragen, ob ich die Breite / Höhe des Shutter Devices anpassen kann.
    Das mit den anpassbaren Hintergrundbildern ist ja mega, aber eine Grössenanordnung würde das ganze toppen.

    Vielen Dank für kurzes Feedback.
    hhhc
    ++ Der ultimative ETS Schnellkurs ++
    KNX und die ETS vom Profi lernen
    www.ets-schnellkurs.de

    #2
    Servus,

    hast du was herausgefunden?
    Hätte auch das Problem.

    Gruß

    Steff

    Kommentar


      #3
      Hallo,

      die rein optische Anpassung der Breite ist recht einfach möglich. Allerdings mit 2 Kompromissen:
      • Man verliert die "responsiveness", d.h. es sieht auf einem iPhone nicht mehr schön aus
      • Die Overlay Controls wurden in meinem Versuch nicht getrennt, sondern die linke Breite blieb (siehe Screenshot)

      Ich überlege, die Visu für iPad zu optimieren, so dass erster Punkt dann egal wäre.

      Wie habe ich es gemacht:
      1) im HTML der Seite:
      statt <div class="block"> habe ich <div class="block wide"> gesetzt

      HTML-Code:
      <div class="block wide">
        <div class="set-2" data-role="collapsible-set" data-theme="c" data-content-theme="a" data-mini="true">
          <div data-role="collapsible" data-collapsed="false">
            <h3>Jalousie - Leonie Fenster Ost</h3>
                  {{ device.shutter ('shutter3', 'Nord', 'arbeitszimmer1_jalousie_fahren', 'arbeitszimmer1_jalousie_stop', 'arbeitszimmer1_jalousie_position_status',
                  '', 'arbeitszimmer1_jalousie_angle_status', 'arbeitszimmer1_jalousie_store', 0, 100, 10) }}
          </div>
        </div>
      </div>
      2) visu.css
      Code:
      #OG_kinder-shutter3 {
      background-image: url('../../pics/shutter/feldblumenstrasse_arbeitszimmer.png');
        width: 300px;
      }
      #OG_kinder-shutter3 .blade-pos {
        width: 300px;
      }
      #OG_kinder-shutter3 .blade-neg {
        width: 300px;
      }
       
      .wide {
        width: 100%;
      }
      Gruss
      hhhc

      PS: Bei mir sind das noch Trockenübungen, da der Verteiler erst im September eingebaut wird und ich mich nur mal so an der Visu probiert habe.
      Angehängte Dateien
      ++ Der ultimative ETS Schnellkurs ++
      KNX und die ETS vom Profi lernen
      www.ets-schnellkurs.de

      Kommentar

      Lädt...
      X