Delicious LinkedIn Facebook Twitter RSS Feed

Botón con varios link efecto face


Código:
<script language="Javascript">
//<![CDATA[
<!-- http://loseasi.blogspot.com/ -->
var timerID = null
var timerRunning = false
var charNo = 0
var charMax = 0
var lineNo = 0
var lineMax = 4 // Cambiar por el total de link
var lineArr = new Array(lineMax)
var urlArr = new Array(lineMax)
lineArr[1] = "Lo se así - de todo un poco - blogger"
urlArr[1] = "http://loseasi.blogspot.com/"
lineArr[2] = "Dejotas Radio"
urlArr[2] = "http://dejotasradio.blogspot.com/"
lineArr[3] = "Contacto"
urlArr[3] = "http://loseasi.blogspot.com/p/contacto.html"
lineArr[4] = "Messenger"
urlArr[4] = "http://loseasi.blogspot.com/p/messenger.html"
var lineText = lineArr[1]
function StartShow() {
StopShow()
ShowLine()
timerRunning = true
}
function FillSpaces() {
for (var i = 1; i <= lineWidth; i++) {
spaces += " "
}
}
function StopShow() {
if (timerRunning) {
clearTimeout(timerID)
timerRunning = false
}
}
function ShowLine() {
if (charNo == 0) {
if (lineNo < lineMax) {
lineNo++
}
else {
lineNo = 1
}
lineText = lineArr[lineNo]
charMax = lineText.length
}
if (charNo <= charMax) {
document.formFaceVku.buttonFaceVku.value = lineText.substring(0, charNo)
charNo++
timerID = setTimeout("ShowLine()", 200) // Tiempo que aparece o se desliza el botón.
}
else {
charNo = 0
timerID = setTimeout("ShowLine()", 5000) // Tiempo que cambia de un botón o link a otro.
}
}
function GotoUrl(url)
{
top.location.href = url
}
document.write("<form name=\"formFaceVku\">");
document.write("<input style=\"color:#0093DD;cursor:pointer;\" type=\"button\" name=\"buttonFaceVku\" value=\"&{lineText}\" size=\"18\" onClick=\"GotoUrl(urlArr[lineNo])\">");
document.write("</form>");
StartShow();
//]]>
</script>

Para agregar a quitar link:

Ver las siguientes 2 lineas:

lineArr[1] = "Lo se así - de todo un poco - blogger"
urlArr[1] = "http://loseasi.blogspot.com/"

La primera linea es el texto que se muestra en el bóton.
la segunda es el link.

Donde dice lineArr[1] y urlArr[1] tienen que cambiar el numero 1, 2, 3, 4, etc...  según la cantidad de link.

Donde dice: var lineMax = 4 cambiar el 4 por el total de link puestos.

Así:

var lineMax = 6 // Cambiar por el total de link
var lineArr = new Array(lineMax)
var urlArr = new Array(lineMax)
lineArr[1] = "Lo se así - de todo un poco - blogger"
urlArr[1] = "http://loseasi.blogspot.com/"
lineArr[2] = "Dejotas Radio"
urlArr[2] = "http://dejotasradio.blogspot.com/"
lineArr[3] = "Contacto"
urlArr[3] = "http://loseasi.blogspot.com/p/contacto.html"
lineArr[4] = "Messenger"
urlArr[4] = "http://loseasi.blogspot.com/p/messenger.html"
lineArr[5] = "TEXTO 5"
urlArr[5] = "LINK 5"
lineArr[6] = "TEXTO 6"
urlArr[6] = "LINK 6"
 
Siempre que agreges o quites link (las 2 lineas) cambiar también el total maximo.

Cambiar velocidad:

200 es el tiempo que aparece o se desliza el botón.

5000 es el tiempo que cambia de un botón o link a otro.

Personalizar el botón:

Donde dice: style=\"color:#0093DD;cursor:pointer;\"

Se puede agregar estilos CSS.
  
Ejemplo un fondo de color negro con letras blancas sin borde y un separación de 2px:

style=\"color:#ffffff;cursor:pointer;background-color:#000000;border:0;padding:2px;\"

 OJO, tiene que ir dentro de:  \" y \" separados por ;

0 comments:

Post a Comment