0
151
Views¿Cómo elimina el cursor parpadeante al hacer clic en el texto en un div (no <input>)
Así que estoy construyendo un pequeño y divertido juego Jeopardy (Se reservan todos sus derechos) para mi trabajo.
Construirlo usando grid es súper fácil y todo, pero cuando hago clic en <div> , agrega el cursor de texto parpadeante después (como se muestra en la imagen a continuación).
Intenté hacer cursor: default y cursor: none -- ninguno hizo que el JS dejara de funcionar, y por defecto no hizo nada (eso es lo que tiene la imagen).
CSS
#round-one { display: grid; grid-template-columns: 200px 200px 200px 200px 200px; grid-template-rows: 100px 100px 100px 100px 100px 100px; gap: 20px; background-color: black; width: 1080px; height: 700px; border: 20px solid black; } .round>div, .round>span { background-color: #021489; display: inline-grid; height: 100px; width: 200px; cursor: default; /** Same Location I tried cursor: none **/ } .header { font-variant: small-caps; font-weight: bold; color: white; justify-content: center; align-items: center; font-size: 2em; text-align: center; } .answer { font-weight: bold; color: #D7A04B; justify-content: center; align-items: center; font-size: 4em; text-align: center; } Sección HTML
<body> <div id="round-one" class="round"> <div id="r1c1r1" class="answer" onclick="question('r1c1r1')"> 100 </div> y JS
<script> function question(id) { alert("test"); } </script> Me ocuparé del JS real que usaré más adelante. Tal como está ahora, cursor: default me permite hacer clic y recibir la alert() .
1 answers
Answer question0
Uso caret-color: transparent; para mis formularios donde encuentro que el símbolo de intercalación parpadeante me distrae. Técnicamente, el signo de intercalación seguirá estando "allí" Simplemente invisible.