Tengo un problema con el svg en YouTube.
Si coloca el mouse sobre, justo al lado derecho del svg y hace clic, el video no se abre, sino que lo lleva de regreso a la página anterior.
Al hacer clic en el espacio entre el svg, que debería abrir el video de YouTube, no lo hace, sino que lo lleva de regreso a la página anterior.
Todo lo que esté fuera del svg debería ser YouTube.
Solo se debe hacer clic en el área dentro de la línea roja para llevar al usuario a Inicio
pointer-events: none; tendría que estar en su lugar, o interfiere con el video de YouTube.
El problema con el uso de:
svg.home { pointer-events: none; }Si bien eso funciona con el svg que no interfiere, también deshabilita la posibilidad de hacer clic en el svg.
¿Cómo se arreglaría esto?
Necesito que se pueda hacer clic en el svg y que no interfiera con YouTube.
https://jsfiddle.net/hwm8qtoz/1/
.home { position: absolute; top: calc(60% - 25px); /*25px is half the height of the svg*/ left: 0px; width: 50px; height: 50px; fill: green; cursor: pointer; }Porque CSS tiene un cuadro modal y todo es un cuadro. Entonces, toda la casa está dentro de una caja y se puede hacer clic en toda la caja o no se puede hacer clic en toda la caja.
Se puede solucionar de dos formas