Hallo liebes Forum,
Für mein Raspberry Pi Projekt habe ich eine kleine Webseite eingerichtet mit der ich über das <button>-Tag Leds ansteuern kann.
Hier ist zunächst ein kleiner Code-Ausschnitt:
<p>Raffstore 1
<button id ="btn1"onmousedown="messageToServer('btn1_onmousedown');"onmouseup="messageToServer('btn1_onmouseup');">rauf</button>
<button id ="btn2"onmousedown="messageToServer('btn2_onmousedown');"onmouseup="messageToServer('btn2_onmouseup');">runter</button>
</p>
Was soll dieser Code nun bewirken? Drückt man einen Button, soll die Led angehen, löst man den Button wieder, soll die Led ausgehen. Also eine Taster-Funktionalität. Das Ganze funktioniert auch einwandfrei im Browser (Chrome) am Desktop-Rechner.
Rufe ich nun diese Website über einen Browser (ebenfalls Chrome) am Android-Tablet auf, ist das Verhalten des Buttons anders. Hier bleibt der Button nach dem Betätigen aktiviert, ein neuerliches Betätigen deaktiviert den Button wieder. D.h. in diesem Fall hat der Button ein Toggle-Verhalten.
Warum ist das so...wie kann man das Taster-Verhalten auch am Android-Tablet erreichen?
Ein weiteres komisches Verhalten habe ich im iPhone-Browser beobachtet...da man die Buttons mit den Fingern am Smartphone / Tablet betätigen möchte, habe ich für das Padding verhältnismäßig großer Werte vergeben. Am Desktop- und Android-Tablet-Browser stimmt die Anzeige auch dementsprechend. Nur im iPhone-Browser werden die Buttons nur sehr klein angezeigt´. Nämlich dem Text des Buttons entsprechend. Warum ist das so und wie kann man die Buttons auch am iPhone größer darstellen?
Ich bin eher ein Rookie was HTML Programmierung anbelangt, vor allem in Verbindung mit Smartphones und Tablets. Aber vielleicht hat ja irgendjemand von euch Antworten für mich?!?!
Danke im Voraus
lg
Rednose
Für mein Raspberry Pi Projekt habe ich eine kleine Webseite eingerichtet mit der ich über das <button>-Tag Leds ansteuern kann.
Hier ist zunächst ein kleiner Code-Ausschnitt:
<p>Raffstore 1
<button id ="btn1"onmousedown="messageToServer('btn1_onmousedown');"onmouseup="messageToServer('btn1_onmouseup');">rauf</button>
<button id ="btn2"onmousedown="messageToServer('btn2_onmousedown');"onmouseup="messageToServer('btn2_onmouseup');">runter</button>
</p>
Was soll dieser Code nun bewirken? Drückt man einen Button, soll die Led angehen, löst man den Button wieder, soll die Led ausgehen. Also eine Taster-Funktionalität. Das Ganze funktioniert auch einwandfrei im Browser (Chrome) am Desktop-Rechner.
Rufe ich nun diese Website über einen Browser (ebenfalls Chrome) am Android-Tablet auf, ist das Verhalten des Buttons anders. Hier bleibt der Button nach dem Betätigen aktiviert, ein neuerliches Betätigen deaktiviert den Button wieder. D.h. in diesem Fall hat der Button ein Toggle-Verhalten.
Warum ist das so...wie kann man das Taster-Verhalten auch am Android-Tablet erreichen?
Ein weiteres komisches Verhalten habe ich im iPhone-Browser beobachtet...da man die Buttons mit den Fingern am Smartphone / Tablet betätigen möchte, habe ich für das Padding verhältnismäßig großer Werte vergeben. Am Desktop- und Android-Tablet-Browser stimmt die Anzeige auch dementsprechend. Nur im iPhone-Browser werden die Buttons nur sehr klein angezeigt´. Nämlich dem Text des Buttons entsprechend. Warum ist das so und wie kann man die Buttons auch am iPhone größer darstellen?
Ich bin eher ein Rookie was HTML Programmierung anbelangt, vor allem in Verbindung mit Smartphones und Tablets. Aber vielleicht hat ja irgendjemand von euch Antworten für mich?!?!
Danke im Voraus
lg
Rednose
