Focalizar en un div

mayid · #1 (**permalink**) 12/04/2010, 19:31

Como se hace para focalizar en un div? Entiendo que para inputs se usa focus(), pero que hay para los divs? Scroll? No encuentro como!

Dany_s · #2 (**permalink**) 13/04/2010, 04:25

también con focus pero el div debe tener el atributo tabindex

Código HTML:

<html>
<head>
    <title>Prueba</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
    <script>
    $( function (){
        $('div').focus( function (){
            $(this).css('backgroundColor', 'red');
        }).blur( function (){
            $(this).css('backgroundColor', 'green');
        });
            
    });
    </script>
    <style>
        div { width:200px; height:200px; background-color:blue; margin:5px}
    </style>
</head>
<body>
    <div tabindex="1"></div>
    <div tabindex="2"></div>
</body>
</html>

mayid · #3 (**permalink**) 13/04/2010, 08:26

Buenísimo Dany! Funciona perfecto.

mayid · #4 (**permalink**) 13/04/2010, 09:17

Che, tabindex no valida en xhtml. Que se puede hacer?

juaniquillo · #5 (**permalink**) 13/04/2010, 09:37

tabindex no es un atributo xhtml

mayid · #6 (**permalink**) 13/04/2010, 09:41

Bueno chicos, no importa. Me encantó tabindex pero para mi xhtml ya solucioné focalizar en un textarea. Esto, en un contexto wysiwyg.

Dany_s · #7 (**permalink**) 13/04/2010, 14:02

ok, igual podés agregarle con jquery

Código HTML:

<html>
<head>
    <title>Prueba</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
    <script>
    $( function (){
        $('div').attr('tabindex', '');
	$('div').focus( function (){
            $(this).css('backgroundColor', 'red');
        }).blur( function (){
            $(this).css('backgroundColor', 'green');
        });
            
    });
    </script>
    <style>
        div { width:200px; height:200px; background-color:blue; margin:5px}
    </style>
</head>
<body>
    <div></div>
    <div></div>
</body>
</html>

mayid · #8 (**permalink**) 13/04/2010, 14:19

Cita:

$('div').attr('tabindex', '');

Un truco para validar? Jaja! No, igual voy a tener dos versiones de la misma pagina: una version con jquery (para editar) y otra sin jquery para visitas. Asi que necesito que todo sea simple. Y ya esta funcionando. Gracias!