Imagen en esquina de recuadro de tabla

[Aper]

Hola chicos.. les paso a contar lo que necesito y que nose como hacerlo.

necesito algun script que haga esto.







Se preguntaran que es esto.. bueno como ven en cada esquina de cada reguadro de la tabla aparece una imagen, necesito un script que haga que aparezca esta imagen al pasar el mouse por ese recuadro y desaparezca al dejar el recuadro, la imagen tiene que estar en esa diagonal y no en ningun otro lado.

ahora lo que necesito esque esta imagen no sea tomada de un solo <span....></span> pro ejemplo, por que esta imagen va a ser un link hacia un sector de edicion que toma el contenido de ese recuadro nose si me explico.

osea si tengo 100 recuadros cada uno de esos links posicionados en esa diagonal que apunta esa imagen va a ser un link diferente siempre, osea que tiene que ser tomado de formas diferentes y para cada link tiene que haber un <a href=""....></a> nuevo..

Si alguien lo hizo, conoce algun script, o sabe algo por favor que me lo diga.



Gracias...

[deirdre]

Pero tú quieres que eso se haga con ajax?

O es un evento onmouseover de javascript. De todas formas proporciona tu código para empezar a tener cosas claras respecto a tu cuestión.

Bye

[Aper]

Bueno basicamente lo que necesito... y tenemos un claro ejemplo es en facebook, cuando te posas en la imagen del perfil incial te muestra en el margen superior derecho el menu para editar tu foro o lo que sea.

Ejemplo:

[Aper]

Alguien ?..

[deirdre]

Hola Aper

Si pudieras poner otro ejemplo sería bueno. Yo es que no tengo cuenta en facebook y no puedo ver lo que dices.

O espera a que alguien más te ayude...

Bye

[caricatos]

Hola:

Mientras no se demuestre lo contrario, la pregunta no tiene nada que ver con Ajax, así que movemos el tema al foro javascript... no estoy seguro de lo que quieres, pero parece que buscas un tooltip... si es eso, te recomiendo que revises nuestras FAQs

Saludos

[Aper]

Aver.. vamos a intentar explicar lo que quiero hacer...

tenemos una tabla si.. donde el codigo seria algo asi digamos:

Código HTML:

<table width="200" border="1">
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table> 

Que quire decir, que si quiero que se pose una imagen en la diagonal superior derecha de el recuadro (<td>...</td>), cada td tiene que tener un "onmouseover".. pero lo que nose como hacer es precisamente eso, el codigo jscript o ajax que me muestre esa imagen en esa diagonal con el link. pero que pasa con el link

Podemos tener un codigo que el mouseover llame de un link estatico, estatico por que.. pro que siempre va a ser le mismo link para todos los td, pero yo necesito un link diferente por cada td. seguramente se lo podria hacer con getelementid o como se escriba.. pero bueno necesito algo asi.


Gracias

[abimaelrc]

Puedes hacerlo de esta manera:
Nota: cambiale el nombre de la imagen y listo.

Código HTML:

<script language="javascript">
function setThisMouse(w){
    w.style.backgroundImage = "url(edit.png)";
    w.style.backgroundPosition = "top right";
    w.style.backgroundRepeat = "no-repeat";
}
function unsetThisMouse(w){
    w.style.backgroundImage = "";
    
}
</script>
<table width="200" border="1">
  <tr>
    <td onmouseover="setThisMouse(this)" onmouseout="unsetThisMouse(this)">&nbsp;</td>
    <td onmouseover="setThisMouse(this)" onmouseout="unsetThisMouse(this)">&nbsp;</td>
    <td onmouseover="setThisMouse(this)" onmouseout="unsetThisMouse(this)">&nbsp;</td>
  </tr>
  <tr>
    <td onmouseover="setThisMouse(this)" onmouseout="unsetThisMouse(this)">&nbsp;</td>
    <td onmouseover="setThisMouse(this)" onmouseout="unsetThisMouse(this)">&nbsp;</td>
    <td onmouseover="setThisMouse(this)" onmouseout="unsetThisMouse(this)">&nbsp;</td>
  </tr>
  <tr>
    <td onmouseover="setThisMouse(this)" onmouseout="unsetThisMouse(this)">&nbsp;</td>
    <td onmouseover="setThisMouse(this)" onmouseout="unsetThisMouse(this)">&nbsp;</td>
    <td onmouseover="setThisMouse(this)" onmouseout="unsetThisMouse(this)">&nbsp;</td>
  </tr>
</table>
 

[Aper]

si lo habia pensado asi pero el unico problema que me generaba que sea asi es que no podia poner un link en esa esquina.. osea recuerda que ese cuadro que quiero que aparezca en la diagonal de a lo sumo.. 3x3 px... es un link que agregaria un comentario a ese TD.

Saludos.. y gracias por tu ayuda.

[abimaelrc]

Pero puedes colocar que todo ese td sea un link en vez de esa imagen

[Aper]

Claro.. si todo se puede pero el tema es que yo necesito solo que sea imagen sea el link, osea en el td hay contenido entendes, y esa iamgen lo que hace es agregar un comentario a ese campo nada mas.. y si tengo 100 campos (td) son 100 link diferentes y 100 onmouseover y demas.... es complicado pero bueno :P

lo mas complicado de todo es que esta imagen con link, no tiene que modificar el contenido que se encuentre dentro del <td>contenido</td>


Gracias igual

[deirdre]

Pero entiendo que no es que esa pequeña imagen sea un link sino que, mediante el colocado del cursor, se muestre un tooltip (tal como apuntaba caricatos más arriba).

¿Es eso?

Normalmente entendemos por link un enlace que abre una página, ¿o no?.

Desde el principio del hilo no entiendo del todo los planteamientos de Aper. Seguramente debido a mi torpeza...

[Aper]

el ejemplo mas claro es el del facebook, solo que es una iamgne.. lo que yo quiero hacer es que sea en un td nada mas que eso.