Das Ziel ist, dass die Linien von der Mitte der jeweiligen Buttons ausgehen. Nach einem erspielten Ballwechsel sollen dann die Linien wieder verschwinden indem ich auf Punkt oder Fehler klicke. Ansonsten gäbe es zu viele Linien und es wäre unübersichtlich. Ungefähr so habe ich mir das vorgestellt:
Beiträge von noclue
-
-
<body>
<main>
<div class="grid-container">
<div class="item1">
<button class="schlagarten"> ruckhand</button>
</div>
<div class="item2">
<button class="schlagarten"> vorhand</button>
</div>
<div class="item3">
<button class="schlagarten"> mitte</button>
</div>
<div class="item4">
<button class="schlagarten"> mitte</button>
</div>
<div class="item5">
<button class="schlagarten"> vorhand</button>
</div>
<div class="item6">
<button class="schlagarten"> ruckhand</button>
</div>
<div class="item7">
<div class="umrandung"> <div>
</div>
<div class="item8">
<div class="umrandung"> <div>
</div>
<div class="item9">
<div class="umrandung"> <div>
</div>
<div class="item10">
<div class="umrandung"> <div>
</div>
</div>
</main>So sieht der Html Code aus ich habe es mit einem Grid Container dargestellt.
-
Hallo zusammen
Wie ihr im Bild sehen könnt habe ich ein Tischtennis Tisch dargestellt mit verschiedenen Button drauf. Anhand dieser Buttons kann angeklickt werden wie der Gegner die Bälle platziert hat. Nun möchte ich eine Funktion hinzufügen welche die Buttons automatisch mit einer Linie verbinden sobald sie gedrückt werden. Das heisst, der erst gedrückte Button sollte mit dem zweiten verbunden werden, der zweite mit dem dritten und so weiter. Anhand dessen sollte man dann schlussendlich eine Übersicht des ganzen Ballwechsel bekommen. Hat einer eine Idee wie ich diese Linien beim Drücken der Buttons einzeichnen kann? Habe euch im Anhang noch ein Bild der Homepage hochgeladen. Der Httml Code werde ich auch gleich noch hinzufügen.