Beim Hovern über einen Button ein Rechteck (z.B) einblenden

[bobjunior]

Moin,

Ich hoffe, ich kann mein Problem/meine Frage gut genug beschreiben.

Und zwar habe ich es bisher nicht geschafft, dass beim hovern über einen Button beispielsweise eine geometrische Form eingeblendet wird. Das einzige, was ich geschafft habe, ist, dass eine Box mit Text auftaucht. Mein Ziel ist es aber, dass beim hovern über einen Button ein Rechteck an einer bestimmten Position auf meiner Website auftaucht.

Schafft man dies ausschließlich mit HTML und CSS? Und wenn ja, wie?

Ich würde mich über hilfreiche Antworten sehr freuen,

Grüße

 

[basti1012]

Das könnte mit Css klappen wenn man die Position des Rechtecks immer an der gleichen Stelle haben möchte.
Soll das Rechteck immer woanders auftauchen musst du wohl Javascript verwenden

 

[bobjunior]

Das Rechteck soll immer an der gleichen Stelle sein

 

[basti1012]

Ohne Javascript geht es nur wenn der Container kein Parent Element ist.
Ich habe mal ein Beispiel gemacht (nicht auf das Layout achten, weil habe irgendwas Fertiges genommen).
Ohne Js geht es weil das Rechteck in gleichen Container ist und somit ein Geschwister oder Nachbar Element ist.
Beim JS Button geht es nicht, weil der Container mit dem Rechteck kein Schwester, Nachbar oder Kind ist, deswegen kommt da nur Javascript infrage.

Man müsste deine Seite kennen , dann kann ich dir sagen, ob es ohne JS geht oder nur mit.
Kommt darauf an wo der Button und das Rechteck ist.


Link zur Lösung