Skip to main content
título editado
Enlace
GhostCoder
  • 179
  • 1
  • 2
  • 14

Texto se mantiene en negro al seleccionar cambiar el color negro ende texto a blanco al seleccionar un fondo negro con input check

Origen Enlace
GhostCoder
  • 179
  • 1
  • 2
  • 14

Texto se mantiene en negro al seleccionar el color negro en un input check

Tengo un codigo html con varios input check que cambian el color del fondo tanto como el texto y cuando los colores son iguales, envió un alerta para no permitir seleccionar los colores iguales.

pero tengo un problema que al seleccionar primero el color negro de fondo al entrar al sitio, cambia el fondo, pero no alerta que el texto ya esta en negro, entonces no se ve.

    <div class="grupo">
        <h1>Color de fondo</h1>
        <input type="radio" name="fon" onclick="colorFondo('#fff');" />
        Blanco <br />
        <input type="radio" name="fon" onclick="colorFondo('#000');" />
        Negro <br />
        <input type="radio" name="fon" onclick="colorFondo('#f00');" />
        Rojo <br />
        <input type="radio" name="fon" onclick="colorFondo('#0f0');" />
        Verde <br />
        <input type="radio" name="fon" onclick="colorFondo('#00f');" />
        Azul
    </div>
    <div class="grupo">
        <h1>Color de texto</h1>
        <input type="radio" name="texto" onclick="colorTexto('#fff');" />
        Blanco <br />
        <input type="radio" name="texto" onclick="colorTexto('#000');" />
        Negro <br />
        <input type="radio" name="texto" onclick="colorTexto('#f00');" />
        Rojo <br />
        <input type="radio" name="texto" onclick="colorTexto('#0f0');" />
        Verde <br />
        <input type="radio" name="texto" onclick="colorTexto('#00f');" />
        Azul
    </div>

<script>
    // Defino variables GLOBALES
    var fondo;
    var texto;
    // Funcion para llamar ejecutar color de fondo
    function colorFondo(color) {
        // le damos un valor a la varible global
        fondo = color;
        // Creamos una condicion para comprobar el color seleccionado
        if(fondo != texto){
            document.bgColor = color; 
        }else{
           alert('no es posible seleccionar este color');
        }

    }
    // Funcion para llamar ejecutar el color de texto 
    function colorTexto(color) {
        // le damos un valor a la varible global
        texto = color;
        // Creamos una condicion para comprobar el color seleccionado
        if(texto != fondo ){
            document.fgColor = color; 
        }else{
           alert('no es posible seleccionar este color');
        }
    }
</script>