Hallo zusammen,
ich habe eine spezielle Anfrage:
Ich möchte eine transparente Box mit einem Text in der Mitte über einen iframe erscheinen lassen, sobald man mit einer Maus rüber hovert. Das iframe dahinter soll nicht klickbar sein, sondern die transparente Box soll einen Link beim draufklicken öffen. Soweit hat es schon geklappt, nur leider wird die transparente Box unter dem iframe angezeigt und nicht dadrauf. Mit Margin -XXXpx habe ich es schon versucht, jedoch ist die Box dann nicht klickbar:
Ich hoffe ihr könnt mir helfen. :)
ich habe eine spezielle Anfrage:
Ich möchte eine transparente Box mit einem Text in der Mitte über einen iframe erscheinen lassen, sobald man mit einer Maus rüber hovert. Das iframe dahinter soll nicht klickbar sein, sondern die transparente Box soll einen Link beim draufklicken öffen. Soweit hat es schon geklappt, nur leider wird die transparente Box unter dem iframe angezeigt und nicht dadrauf. Mit Margin -XXXpx habe ich es schon versucht, jedoch ist die Box dann nicht klickbar:
#frame {
width: 600px;
height: 330px;
border: none;
}
#link {
width: 600px;
height: 330px;
display: flex;
align-items: center;
justify-content: center;
opacity: 0;
}
#link:hover {
background: rgba(255, 255, 255, 0.45);
opacity: 1;
}
#frame:hover + #link {
opacity: 1;
}
<iframe id="frame" src="https://de.wikipedia.org/wiki/Inlineframe" scrolling=no>
</iframe>
<a id="link" href="https://www.youtube.com" target="_blank">Click here</a>
Ich hoffe ihr könnt mir helfen. :)
