Crear mensajes flotantes
- Haz que tus mensajes floten sobre la página como globos.
- El movimiento es producido por una función aleatoria inteligente que cambia la velocidad y dirección de cada mensaje separadamente..
- Añade tantos mensajes como quieras.
- Cambia el enlace, fuente, tamaño de fuente y color de fuente, así como el fondo de cada mensaje por separado.
EL CÓDIGO ES EL SIGUIENTE
<html>
<head>
</head>
<script>
<!– Beginning of JavaScript –
var message=new Array()
message[0]=»TEXTO1″
message[1]=»TEXTO2″
message[2]=»TEXTO3″
message[3]=»TEXTO4″
message[4]=»TEXTO5″
// You may add a link for each message.
// In case you do not want to link a message just add a ‘#’ instead of an URL
var message_link=new Array()
message_link[0]=»URL DE LA PAGINA WEB»
message_link[1]=»URL DE LA PAGINA WEB»
message_link[2]=»URL DE LA PAGINA WEB»
message_link[3]=»URL DE LA PAGINA WEB»
message_link[4]=»URL DE LA PAGINA WEB»
// font-family for each message
var message_font=new Array()
message_font[0]=»Comic Sans MS»
message_font[1]=»Times»
message_font[2]=»Courier»
message_font[3]=»Verdana»
message_font[4]=»Arial»
// font-size for each message
var message_fontsize=new Array()
message_fontsize[0]=14
message_fontsize[1]=12
message_fontsize[2]=10
message_fontsize[3]=9
message_fontsize[4]=8
// font-color for each message
var message_fontcolor=new Array()
message_fontcolor[0]=»yellow»
message_fontcolor[1]=»black»
message_fontcolor[2]=»FF0000″
message_fontcolor[3]=»007700″
message_fontcolor[4]=»000077″
// backgroundcolor for each message
var message_bgcolor=new Array()
message_bgcolor[0]=»black»
message_bgcolor[1]=»yellow»
message_bgcolor[2]=»FFDDDD»
message_bgcolor[3]=»DDFFDD»
message_bgcolor[4]=»DDDDFF»
// font-weight for each message. Choose a value between 1 and 9
var message_fontweight=new Array()
message_fontweight[0]=1
message_fontweight[1]=9
message_fontweight[2]=5
message_fontweight[3]=7
message_fontweight[4]=9
// width for each message (pixels)
var message_width=new Array()
message_width[0]=300
message_width[1]=200
message_width[2]=300
message_width[3]=200
message_width[4]=100
// padding for each message (pixels)
var message_padding=new Array()
message_padding[0]=4
message_padding[1]=4
message_padding[2]=4
message_padding[3]=4
message_padding[4]=3
// padding for each message (pixels)
var message_border=new Array()
message_border[0]=1
message_border[1]=1
message_border[2]=1
message_border[3]=1
message_border[4]=1
// average speed of the floating images. Higher means faster
var floatingspeed=3
// do not edit the variables below
var tempo=20
var numberofmessages=message.length-1
var stepx=new Array()
var stepy=new Array()
for (i=0;i<=numberofmessages;i++) {
stepx[i]=randommaker(floatingspeed)
stepy[i]=randommaker(floatingspeed)
}
var imgwidth=new Array()
var imgheight=new Array()
for (i=0;i<=numberofmessages;i++) {
imgwidth[i]=10
imgheight[i]=10
}
var x,y
var marginbottom
var marginleft=0
var margintop=0
var marginright
var timer
for (i=0;i<=numberofmessages;i++) {
message_fontweight[0]=100message_fontweight[0]
message_fontweight[1]=100message_fontweight[1]
message_fontweight[2]=100message_fontweight[2]
message_fontweight[3]=100message_fontweight[3]
message_fontweight[4]=100*message_fontweight[4]
}
var spancontent=new Array()
for (i=0;i<=numberofmessages;i++) {
spancontent[i]=»<table border=»+message_border[i]+» cellpadding=»+message_padding[i]+» width=»+message_width[i]+» cellspacing=0><tr><td valign=top bgcolor=»+message_bgcolor[i]+»>»
spancontent[i]+=»<span style=’position:relative; font-family:»+message_font[i]+»;font-size:»+message_fontsize[i]+»pt;font-weight:»+message_fontweight[i]+»‘>»
spancontent[i]+=»<a href='»+message_link[i]+»‘ style=’text-decoration:none’>»
spancontent[i]+=»<font color=»+message_fontcolor[i]+»>»
spancontent[i]+=message[i]
spancontent[i]+=»</a>»
spancontent[i]+=»</span>»
spancontent[i]+=»</td></tr></table>»
}
function setValues() {
if (document.all) {
marginbottom=document.body.clientHeight-5
marginright=document.body.clientWidth-5
for (i=0;i<=numberofmessages;i++) {
var thisspan = eval(«document.all.span»+i)
thisspan.innerHTML=spancontent[i]
var thisspan = eval(«document.all.span»+(i)+».style»)
thisspan.posLeft=randommaker(marginright)
thisspan.posTop=randommaker(marginbottom)
}
for (i=0;i<=numberofmessages;i++) {
var thisspan = eval(«document.all.span»+i)
imgwidth[i]=thisspan.offsetWidth
imgheight[i]=thisspan.offsetHeight
}
checkmovement()
}
}
function randommaker(range) {
rand=Math.floor(range*Math.random())
if (rand==0) {rand=Math.ceil(range/2)}
return rand
}
function checkmovement() {
if (document.all) {
checkposition()
movepictures()
timer=setTimeout(«checkmovement()»,tempo)
}
}
function movepictures() {
if (document.all) {
for (i=0;i<=numberofmessages;i++) {
var thisspan=eval(«document.all.span»+(i)+».style»)
thisspan.posLeft+=stepx[i]
thisspan.posTop+=stepy[i]
}
}
}
function checkposition() {
if (document.all) {
for (i=0;i<=numberofmessages;i++) {
var thisspan=eval(«document.all.span»+i+».style»)
if (thisspan.posLeft>marginright-imgwidth[i]) {
thisspan.posLeft-=Math.abs(stepx[i]+1)
stepx[i]=randommaker(floatingspeed)-1
}
if (thisspan.posLeft<marginleft) {
thisspan.posLeft+=Math.abs(stepx[i])
stepx[i]=randommaker(floatingspeed)
}
if (thisspan.posTop>marginbottom-imgheight[i]) {
thisspan.posTop-=Math.abs(stepy[i])
stepy[i]=randommaker(floatingspeed)-1
}
if (thisspan.posTop<margintop) {
thisspan.posTop+=Math.abs(stepy[i])
stepy[i]=randommaker(floatingspeed)
}
}
}
}
// – End of JavaScript – –>
</script><body id=»thisbody» bgcolor=»#FFFFFF» onLoad=»setValues()» style=»width: 100%; overflow-x: hidden; overflow-y: hidden»><script>
<!– Beginning of JavaScript –
for (i=0;i<=numberofmessages;i++) {
document.write(«<span id=’span»+i+»‘ style=’position:absolute;z-index:100’></span>»)
document.close()
}
// – End of JavaScript – –>
</script></b></p>
<div id=»deletethisblock» style=»position:absolute;top:50px;left:50px;»>
</div>
</body>
</html>
Facebook: https://www.facebook.com/EIMafias/
Twitter:@ElMafiasdelTuit
//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js
(adsbygoogle = window.adsbygoogle || []).push({});