Fehler in IMAGE Widget??

[Tobias]

Hi,
auf einer Seite habe ich mit fixer Positionsangabe mehrere Widgets verteilt. Funktioniert super.
Problem bereitet das Image Widget. Definiere ich mehrere davon, werden alle kaskadierend/hierarchisch aufgebaut. Bei allen anderen nicht.
Achso, Ich arbeite mit FTUI 2.2!

FTUI 2.2 Angabe:

Code Auswählen Erweitern

        <div id="RLMPF1"
          data-type="image"
          style="position:fixed;top:259px;left:250px"
          data-device="Vitosolic_200"
          data-path="images/"
          data-get="Umschalt_Ruecklauf_ohne_Pufferspeicher_image"
          data-width="370px"
          data-height="7px"
        </div>

        <div id="RLMPF2"
          data-type="image"
          style="position:fixed;top:451px;left:285px"
          data-device="Vitosolic_200"
          data-path="images/"
          data-get="Umschalt_Ruecklauf_ohne_Pufferspeicher_image"
          data-width="260px"
          data-height="7px"
          class="rotate-180"
        </div>

        <div id="RLOPF1"
          data-type="image"
          style="position:fixed;top:0px;left:0px"
          data-device="Vitosolic_200"
          data-path="images/"
          data-get="Umschalt_Ruecklauf_ueber_Pufferspeicher_image"
          data-width="370px"
          data-height="7px"
        </div>


Im HTML sieht es so aus:

Code Auswählen Erweitern

<div id="RLMPF1" data-type="image" style="position:fixed;top:259px;left:250px" data-device="Vitosolic_200" data-path="images/" data-get="Umschalt_Ruecklauf_ohne_Pufferspeicher_image" data-width="370px" data-height="7px" <="" div="">

        <div id="RLMPF2" data-type="image" style="position:fixed;top:451px;left:285px" data-device="Vitosolic_200" data-path="images/" data-get="Umschalt_Ruecklauf_ohne_Pufferspeicher_image" data-width="260px" data-height="7px" class="rotate-180" <="" div="">

        <div id="RLOPF1" data-type="image" style="position:fixed;top:0px;left:0px" data-device="Vitosolic_200" data-path="images/" data-get="Umschalt_Ruecklauf_ueber_Pufferspeicher_image" data-width="370px" data-height="7px" <="" div="">

        <img src="images/bar_green_150.gif" style="opacity: 0.8; height: 7px; width: 370px; max-width: 50%;" alt="img">
      </div>
      <img src="images/blank.png" style="opacity: 0.8; height: 7px; width: 260px; max-width: 50%;" alt="img">
    </div>
    <img src="images/blank.png" style="opacity: 0.8; height: 7px; width: 370px; max-width: 50%;" alt="img">
</div>

Sollte es nicht so aussehen??

Code Auswählen Erweitern

<div id="RLMPF1" data-type="image" style="position:fixed;top:259px;left:250px" data-device="Vitosolic_200" data-path="images/" data-get="Umschalt_Ruecklauf_ohne_Pufferspeicher_image" data-width="370px" data-height="7px">
<img src="images/bar_green_150.gif" style="opacity: 0.8; height: 7px; width: 370px; max-width: 50%;" alt="img">
</div>

<div id="RLMPF2" data-type="image" style="position:fixed;top:451px;left:285px" data-device="Vitosolic_200" data-path="images/" data-get="Umschalt_Ruecklauf_ohne_Pufferspeicher_image" data-width="260px" data-height="7px" class="rotate-180">
<img src="images/blank.png" style="opacity: 0.8; height: 7px; width: 260px; max-width: 50%;" alt="img">
</div>

<div id="RLOPF1" data-type="image" style="position:fixed;top:0px;left:0px" data-device="Vitosolic_200" data-path="images/" data-get="Umschalt_Ruecklauf_ueber_Pufferspeicher_image" data-width="370px" data-height="7px">
<img src="images/blank.png" style="opacity: 0.8; height: 7px; width: 370px; max-width: 50%;" alt="img">
</div>

Ich sehe 2 anomalien:
1. Was ist das ?? <="" div="">
2. die img tag gehörien in den jeweiligen div Container. Jeder ist abgeschlossen und enthält nicht den nächsten

Folge ist, meine ganzen Images sind auf der seite "irgendwo", die Positionsangaben passen durch die Kaskadierung überhaupt nicht mehr

[Tobias]

Hi,
kann das wer bestätigen? Oder hab ich irgendwo einen Bock in meiner Config?

[Tobias]

Erledigt.. Das Problem saß wieder einmal 60cm vor dem Bildschirm.
Habe die End-Tags der einleitenden Divs vergessen

        <div id="RLMPF2"
          data-type="image"
          style="position:fixed;top:451px;left:285px"
          data-device="Vitosolic_200"
          data-path="images/"
          data-get="Umschalt_Ruecklauf_ohne_Pufferspeicher_image"
          data-width="260px"
          data-height="7px"
          class="rotate-180">
        </div>

[ext23]

Ich hab auch ein Problem mit dem Image, bei mir funktioniert der Refresh nicht. Weder per default (900) noch wenn ich es angebe. Sitzt das Problem bei mir auch 60cm vor der Glotze?

Code Auswählen Erweitern

<div data-type="image"
data-size="90%"
data-url="http://niederschlagsradar.de/images.aspx?srt=loopvorhersage&jaar=-3&regio=homepage&tijdid=&m=&d=&uhr=&mi="
data-refresh="180"
class="top-space">
</div>

[ext23]

Kann das jemand verifizieren? Ich hab jetzt schon unterschiedliche Browser verwendet und nochmals ein Update von TabletUI gemacht, aber ich bekomme den Refresh leider nicht zum laufen.

Gruß
Daniel

[Ulm32b]

Ich kann das Problem (Image Refresh ohne Funktion) bestätigen, habe leider auch keine Antwort und hoffe auf höheren Rat.

Gruß
Ulm32b

[ext23]

Mhh OK, steht leider nicht der Name des Entwicklers im JavaScript.

Dafür aber folgender Kommentar "//3rd party source refresh"

Nagut, vielleicht findet sich ja noch jemand der mal drüber schauen kann, ich bin leider Java-blond.

/Daniel

[setstate]

Ich kann kein Problem beim Refresh sehen.
Wenn ich in Zeile 69 ein Log einbaue, sehe ich immer pünktlich den Aufruf.
Ob das aber bei eurer "...images.aspx" zum Holen eines neues Image führt, kann ich nicht versichern. Da ist noch Server-Logik dahinter, es ist kein direkter Image aufruf. Evtl. müsste man die URL-Parameter optimieren.

Edit
Es kann aber auch am Cache liegen. Klappt es mit class="nocache" besser ?

[ext23]

OK an dem Cache könnte es liegen, an der ASP Datei nicht, weil es läuft auch mit statischen Bildern nicht.

Ich probiere es mal aus.

[ext23]

Super, lag wirklich am nocache, interessant nur, dass ich das oben schon im Seiten META deaktiviert hatte.

[Tabularasa]

Hallo. Gibt es denn eine Möglichkeit beim Klick auf das Image (QR Code)ein Popup zu öffnen und es vergrößert darzustellen? Weil es schwierig ist auf dem tablet zu scannen. Ich weiß zwar das es ein Popupwidget gibt, jedoch nicht wie ich es einsetzten soll. Habe mal meinen bisherigen Code zum ergänzen angefügt. Danke

Code Auswählen Erweitern

<header><div data-type="label" class="large">WLAN Gast</div></header>
<div data-type="switch" data-device="FritzBox" data-icon="oa-it_router" data-get="box_guestWlan" data-set-on="guestWlan on" data-set-off="guestWlan off" class="cell top-space"></div>
<div data-type="label" class="top-space">Zugangscode</div>
<div data-type="image" data-url="./images/Guest_QR.png" data-size="100%" class="cell"></div>

[setstate]

Die Basisstruktur für ein Popup sieht so aus

Code Auswählen Erweitern


<div data-type="popup" data-height="150px" data-width="250px">
  <div><!-- click object to open the popup --></div>
  <div class="dialog">
  <header>DIALOG</header>
  <div><!-- widget(s) inside the popup dialog --></div>
  </div>
</div>


Hier setzt du nur noch deine Bilder ein

Code Auswählen Erweitern


   <div data-type="popup" data-height="150px" data-width="250px">
     <div><div data-type="image" data-url="./images/Guest_QR.png" data-size="10%" ></div></div>
     <div class="dialog">
             <header>DIALOG</header>
             <div><div data-type="image" data-url="./images/Guest_QR.png" data-size="50%" ></div></div>
     </div>
   </div>