Hola, Aquí les traigo este Código JavaScript que al pasar el mouse por encima dle link, le salga un titulo y una breve descripción de donde nos llevara el link:
Código:
Código:
- Código:
<DIV ID="idCajita" STYLE="position:absolute; visibility:hide;"></DIV>
<script language="javascript1.2">
<!--
var anchoCaja = "140";
var anchoBorde = "1";
// Espacio entre celdas:
var espCel= 0;
//Espacio a los bordes:
var espBor= 3;
// Desplazamiento eje X resp. posicion del raton
var despX = 10;
// Desplazamiento eje Y resp. posicion del raton
var despY = 8;
// Tipo y tamanio letra: titulo
var ffaceTitulo= "Verdana";
var ftamaTitulo= 3;
// Tipo y tamanio letra: texto
var ffaceTexto= "verdana";
var ftamaTexto= 2;
// Colores:
var colFondo = "lightcyan";
var colBorde = "brick";
var colTexto = "black";
var colTitulo = "white";
var colFondoTitulo = "red";
NN4 = (document.layers)? true:false
IE4 = (document.all)? true:false
// Variables GLOBALES:
var x = 0;
var y = 0;
var esVisible = 0;
var alineamiento; // 0: izquierda, 1: centrado; 2: derecha
if (NN4) {
cajita = document.idCajita;
mostrarSi= 'show';
mostrarNo= 'hide';
}
if (IE4) {
cajita = idCajita.style;
mostrarSi= 'visible';
mostrarNo= 'hidden';
}
document.onmousemove= MovimientoRaton;
if (NN4) {
document.captureEvents(Event.MOUSEMOVE);
}
// Funciones a usar con onMouseOver:
function PopDcha (texto, titulo) {
PopCajita (2,texto,titulo);
}
function PopIzda (texto, titulo) {
PopCajita (0,texto,titulo);
}
function PopCentrado (texto, titulo) {
PopCajita (1,texto,titulo);
}
// Funcion a usar con onMouseOut:
function CierraPop () {
esVisible= 0;
Ocultar (cajita);
}
function Mostrar (objeto) {
objeto.visibility= mostrarSi;
}
function Ocultar (objeto) {
objeto.visibility= mostrarNo;
}
function moverAbs (objeto, a, b) {
objeto.left = a;
objeto.top = b;
}
function PopCajita (alin, texto, titulo) {
txt = "<table width=" + anchoCaja + " borderColor=" + colBorde;
txt += " border=" + anchoBorde + " cellspacing=" + espCel;
txt += " cellpadding=" + espBor;
if (titulo != "") {
txt += " bgcolor=" + colFondoTitulo+" >";
txt += "<tr><td><b><font size=" + ftamaTitulo + " face=" + ffaceTitulo;
txt += " color=" + colTitulo + ">" + titulo + "</font></b>";
} else {
txt += ">";
}
txt += "<tr><td bgcolor=" + colFondo + "><font size=" + ftamaTexto;
txt += " face=" + ffaceTexto + " color=" + colTexto + ">" + texto;
txt += "</font></table>";
GenerarCapa(txt);
alineamiento = alin;
AbrirCajita();
}
function AbrirCajita () {
if (esVisible == 0) {
if (alineamiento == 1) { // Center
moverAbs(cajita,x+despX-(anchoCaja/2),y+despY);
}
if (alineamiento == 2) { // Right
moverAbs(cajita,x+despX,y+despY);
}
if (alineamiento == 0) { // Left
moverAbs(cajita,x-despX-anchoCaja,y+despY);
}
Mostrar(cajita);
esVisible = 1;
}
}
function MovimientoRaton (evento) {
if (NN4) {
x= evento.pageX;
y= evento.pageY;
}
if (IE4) {
x= event.x;
y= event.y;
}
if (esVisible) {
if (alineamiento == 1) { // Center
moverAbs(cajita,x+despX-(anchoCaja/2),y+despY);
}
if (alineamiento == 2) { // Right
moverAbs(cajita,x+despX,y+despY);
}
if (alineamiento == 0) { // Left
moverAbs(cajita,x-despX-anchoCaja,y+despY);
}
}
}
function GenerarCapa (txt) {
if (NN4) {
var capa= document.idCajita.document;
capa.write (txt);
capa.close();
}
if (IE4) {
document.all["idCajita"].innerHTML= txt;
}
}
// -->
</script>
<a href="URL DEL ENLACE" onMouseOver="PopCentrado ('Aqui pones la descripción del enlace','AQUI EL TITULO');return true"; onMouseOut="CierraPop();return true;">NOMBRE DEL ENLACE</a>