Problema DIV hiperlink a Facebook

gat · #1 (**permalink**) 14/10/2011, 08:23

He creado un div que hará de botón de Facebook poniendole la imagen de Facebook como background-image y quiero que todo el DIV sea clickable.
Alguien sabe porqué no sale la mano al pasar el ratón sobre el DIV fb???
Hay alguna otra forma más fácl de hacerlo con css??

He intentado lo que voy encontrando por internet pero parece que nada funciona.
Algún maestro del CSS por ahí??? y estoy aprendiendo.

MUCHAS GRACIAS.

Código:

<html>
<head>
<style type="text/css">
#fb{
position: absolute;
width: 43px;
height: 43px;
top: 575px;
left: 395px;
background-image: url("http://www.keepandshare.com/doc/3197530/fb-png-  october-14-2011-6-30-am-1k?da=y");
background-repeat:no-repeat;
}
</style>
</head>

<body>
<div id="fb" onclick="location.href='http://www.facebook.com/EscuelaInfantilChiquimundo';" style="cursor:pointer;"></div>
</body>

</html>

interjsr · #2 (**permalink**) 14/10/2011, 11:17

jajajajaja, por fin. Prueba esto, y perdón por cambiarte el código. (primero <div> y luego <a>)

<html>
<head>
<style type="text/css">
#fb{
position: absolute;
width: 43px;
height: 43px;
top: 100px;
left: 50px;
background-color:red;

}
</style>
<title>ei</title>
</head>

<body>
<div id="fb">
<a href = "http://www.facebook.com/EscuelaInfantilChiquimundo">
nchar
</a>
</div>
</body>

</html>

gat · #3 (**permalink**) 14/10/2011, 12:08

Gracias por tu respuesta interjsr pero no es lo que busco.
Yo sólo busco que el div esté vacío y le pongo una imágen de fondo que es el botón.
Ahora sólo hay que conseguir que todo el div sea clickable y me lleve a FB.

Lo que tú me has mandado es un texto que hace de hiperlink

Entiendes lo que yo digo?

memoadian · #4 (**permalink**) 14/10/2011, 12:28

podrias usar jquery.

Código Javascript:

Ver originaljQuery(function($){
    $("#fb").css("cursor","pointer");
});

eso hace al div clickable, mandale una funcion click, que desate lo que deseas que pase al dar click

;)

gat · #5 (**permalink**) 14/10/2011, 12:36

Gracias memoadian.

Es para mandar una newsletter. No tendrán problemas para mostrarlo los programas de correo de los receptores? (intento hacerlo sólo con CSS porque a lo mejor es más estándar).

Bueno, no entiendo mucho por eso pregunto.

memoadian · #6 (**permalink**) 14/10/2011, 12:52

acabo de probar tu código, y si que me sale la mano en todo el div.

probado en firefox, chrome e IE8

gat · #7 (**permalink**) 14/10/2011, 14:06

Cita:

Iniciado por memoadian

acabo de probar tu código, y si que me sale la mano en todo el div.

probado en firefox, chrome e IE8

Al final he conseguido que me salga la mano cambiando en location.href el punto por un signo igual.
<div id="fb" onclick="location=href='http://www.facebook.com/EscuelaInfantilChiquimundo';" style="cursor:pointer;"></div>

En el navegador sale la mano y funciona el link pero cuando recibo la newsletter en mi correo, sale la mano pero no me abre el navegador (como si no hiciera nada el link)

Esto es rayaaaaaante.
Alguien lo entiende????

dynamicdev · #8 (**permalink**) 14/10/2011, 19:20

Cita:

Iniciado por gat

En el navegador sale la mano y funciona el link pero cuando recibo la newsletter en mi correo, sale la mano pero no me abre el navegador (como si no hiciera nada el link)

Esto es rayaaaaaante.
Alguien lo entiende????

Los clientes de email no interpretan código javascript. Por eso no funciona.

Para que funcione, tienes que poner el enlace con código html.

<div id="fb"">
<a href="http://www.facebook.com/EscuelaInfantilChiquimundo" style="display:block; width:43px; height:43px;"></a>
</div>

gat · #9 (**permalink**) 16/10/2011, 07:24

Dynamicdev , muchísimas gracias. Ahora funciona.
La solución no podía ser más simple.

:)