Einzelnen Beitrag anzeigen
  #2 (permalink)  
Alt 14.09.2020, 08:42
cloned cloned ist offline
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 2.073
cloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekannt
Standard

Ich weiß du hörst das jetzt bestimmt nicht gerne, aber schmeiß den Code weg, der ist doch nicht zu gebrauchen.

Erstens, es gibt im HTML noch mehr Elemente als divs. Ein div ist dazu da um eine Seite zu unterteilen, hat aber keine semantische Bedeutung. Elemente mit semantischer Bedeutung sind zB links, Überschriften, und auch buttons. Dein d-pad sind im Prinzip mehrere Buttons, also verwende auch buttons. Dann hast du auch schon von Haus aus Dinge wie click, touch, etc, darauf.

Auch ist es wirklich nicht nötig dass du onmousedown, onmouseup, etc. definierst. Verwende statt dessen JS Events, dann bist du hier viel unabhängiger und flexibler.

Verwende auch kein einzelnes Bild als HG Bild und teile das dann noch einmal auf, verwende wirklich für jeden Button ein eigenes Bild, egal ob hover zustand oder nicht. Vielleicht brauchst du auch keine Bilder, je nach Design.

Letztens: align attribut wurde nur im letzten Jahrtausend verwendet, als CSS noch nicht wirklich einheitlich unterstützt wurde.

Bezüglich styling: Du kannst jedes Element so stylen wie du willst, auch einen button.

Kurz gesagt, so in etwa macht dein HTML Aufbau sinn:

Code:
<div class="button_container">
  <button class="pad-top"> Top </button>
  <button class="pad-right">Right </button>
  <button class="pad-bottom">Bottom </button>
  <button class="pad-left">Left </button>
</div>
Mehr sollte im HTML nicht stehen, der rest ist dann im CSS und im JS file zu finden.
Mit Zitat antworten
Sponsored Links