Quiero hacer un div con position:fixed
que se superponga al contenido, pero no se puede hacer clic, es decir, cuando hace clic en ese área del div está haciendo clic en el contenido debajo de él. Entonces, el texto debajo del div se puede seleccionar fácilmente. ¿Hay una manera de hacer eso?div no seleccionable con posición: fijo
Respuesta
La solución es agregar pointer-events: none;
al CSS del div superpuesto. Esto hará que todos los eventos señalen los eventos para ignorar el div superpuesto.
Esto se demuestra aquí: http://jsfiddle.net/nayish/7hHvL/.
Observará que la alerta, que está configurada solo para el div inferior, también funciona cuando se hace clic en el div superpuesto.
Puede que tenga que utilizar un setCapture
en el div
subyacente durante el hoverOver
de esta fijo div
y releaseCapture
durante el hoverOut
var underlyingDiv = document.getElementById ("div1");
var overlyingDiv = document.getElementById ("div2");
overlyingDiv.onHoverOver = "underlyingDiv.setCapture";
overlyingDiv.onHoverOut = "underlyingDiv.releaseCapture";
El método setCapture solo funciona en Internet Explorer, pero bueno. – Wayne
lo que está en frente está representada también es lo que se hizo clic. Una forma de manejar eso es hacer un gráfico transparente para los enlaces que aparecen sobre los enlaces y zindex esa imagen transparente frente a la posición de contenido absoluto. Fácil de hacer si los enlaces son botones de menú con un tamaño conocido.
actualización de un ejemplo
<a href="#">
<img src="transparent.gif" width="100" height="100" style="position:absolute; zindex:100">
</a>
<div style="width:100px; height:100px">
this is my menu button
</div>
La posición img: restos absolutos en la posición actual de la pantalla sobre el botón de menú div. zindex lo empujará delante del contenido fijo. Es fácil si conoce el espacio para el enlace que está cubierto.
Esto suena como una solución muy complicada a un problema muy simple ... – Nayish
- 1. posición div fijo en iframe no funciona
- 2. Div con barra de desplazamiento dentro de div con la posición: fijo
- 3. google map V3 posición div cambio fijo relativo
- 4. Posición contenido fijo problema del solapamiento
- 5. IE 6 frente a posición: fijo
- 6. ordenable con texto seleccionable
- 7. Firefox antialising deshabilitado, al usar DIV fijo
- 8. ¿Cómo mantener la div posición fija alineada con div centrado?
- 9. un error con iOS5 (Safari), una "posición: div fijo', y las formas de altura
- 10. ¿Cómo obtengo un div de posición fijo para desplazarme horizontalmente con el contenido? Usando jQuery
- 11. posición: absolute, div under div
- 12. ¿Cómo hacer un div fijo?
- 13. CSS - ancho fijo SPAN/div
- 14. Un div con posición relativa sobre un flotador div
- 15. Jquery soluciona la posición div cuando div alcanza la posición de pantalla, no la posición de desplazamiento
- 16. posición: fijo no funciona en iPad y iPhone
- 17. Centrar en un div con posición absoluta
- 18. CSS posición título div
- 19. JQuery UI redimensionable no admite la posición: fijo; ¿Alguna recomendación?
- 20. Haciendo texto no seleccionable
- 21. Elemento de posición CSS "fijo" dentro del contenedor de desplazamiento
- 22. UITableViewCell no siempre seleccionable?
- 23. ¿Posición DIV relativa a otra DIV?
- 24. Posición CSS: fijo dentro de un elemento posicionado
- 25. Hacer DIV fijo dentro de un DIV desplazable
- 26. Cómo hacer la posición: desplazamiento fijo desplazarse horizontalmente
- 27. Posición fija div Vertical Sólo
- 28. CSS div fijo dentro del contenedor
- 29. Div relativo está pasando sobre div fijo mientras se desplaza
- 30. CSS centrado horizontal de un div fijo?
'pointer-events: none' puede hacerlo ... –