| Casa | Hardware | Redes | Programación | software | Criticar | Sistemas |   
Programación  
  • C /C + + Programming

  • Lenguajes De Programación

  • Delphi Programación

  • Programación Java

  • JavaScript Programación

  • Programación PHP /MySQL

  • Perl Programming

  • Python Programming

  • Rubí Programación

  • Visual Basics Programación
  •  
    Conocimientos Informáticos >> Programación >> JavaScript Programación >> Content
    Cómo comprobar si el ratón está sobre DIV en JavaScript
    JavaScript permite a un sitio web para responder a eventos de usuario , cambiar el contenido de una página basada en diversas acciones de teclado y ratón . Menús y botones a menudo sirven como disparadores para esos cambios, pero DIVs pueden ser igualmente sensibles . A DIV es una etiqueta HTML que sirve como contenedor de otro contenido , como texto y fotos. Pasando el ratón sobre cualquier parte de la DIV puede desencadenar un cambio. Al mover el ratón fuera del DIV puede desencadenar otro . Instrucciones
    1

    Insertar una función auxiliar entre las etiquetas de la cabeza que le permite a su script funcione en todos los navegadores . La función añadir detectores de eventos a elementos HTML de la página. Cuando se le llama, la función auxiliar toma tres argumentos , o conjuntos de instrucciones : . El elemento de destino , el tipo de evento y función para llamar
    función

    addEvent (obj , tipo, fn ) {
    < p > if ( obj.attachEvent ) {

    obj [' e' + tipo + fn ] = fn ;

    obj [Tipo fn + ] = function ( ) { obj [' e' + tipo fn + ] ( window.event ) ;}

    obj.attachEvent ( 'on' + tipo obj [Tipo fn + ] ) ; } else


    obj . addEventListener (tipo, fn , false) ; }


    2

    Crear una función entre las etiquetas de la cabeza que utiliza el evento de carga o la carga de la página en la ventana , para llamar la función " testMouse " . Esto conectar dos detectores de eventos a tu DIV :

    window.onload = testMouse ;
    3

    Crear funciones que se traducirá en el color de su DIV cambiar en la página basado en el mouseover y eventos mouseout . Comience por crear " testMouse ", que le conseguirá el DIV por su ID de " testDiv . " Preste atención a los eventos mouseover o mouseout y llamar a las funciones " addColor " o " removeColor " , respectivamente . Cree la función " removeColor " que cambian el color de fondo " addColor " e imágenes

    testMouse function () { var

    divField = document.getElementById ( " testDiv " ) .
    < P > addEvent ( divField , " mouseover " , addColor ) ;

    addEvent ( divField , ' mouseout ' , removeColor ) ;

    }

    addColor function () {

    var removeColor () { var

    divField = document.getElementById ( " testDiv ");

    divField.style.backgroundColor = ""; }


    4

    Place tus etiquetas DIV y texto de ejemplo entre las etiquetas del cuerpo del documento :


    texto aquí Texto aquí Texto aquí . < /p >

    < /div >
    5

    Place estilos CSS para el dIV entre las etiquetas de la cabeza para que sea de un tamaño fijo y darle un fondo azul :