JUEGOSTRUCOSQWERTY
DIVIERTETE EN LA MEJOR WEB

EFECTOS HTML

Imagen de fondo con movimiento: este código te permite poner cualquier imagen de

fondo en tu página web, apreciando movimiento al deslizarte. Para utilizar este

código, pégalo en 'Texto por encima de la página'. 
 

 

<style type="text/css">

body 

{

background-image:

url(URL DE LA IMAGEN AQUÍ)

}

</style>

 

 

 

 

Imagen de fondo sin movimiento: este código te permite poner cualquier imagen de

fondo en tu página web, sin apreciar movimiento al deslizarte. Para utilizar este

código, pégalo en 'Texto por encima de la página'.
 

 

 

<style>

body

{

background-image: url(URL DE LA IMAGEN AQUÍ);

background-repeat: no-repeat;

background-attachment: fixed

}

</style>

 

 

 

 

Centrar la página: este código te permite centrar tu página web que viene por

defecto cuando creas tu página en PWG. Para utilizar este código, pégalo en 'Texto

por encima de la página'.
 

 

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http:/www.w3.org/1999/xhtml"> <div style="width:900px; position: relative; margin-left: auto; margin-right: auto;">  

 

 

 

Mensaje de bienvenida: este código te permite poner un mensaje dando la bienvenida

a los visitantes de tu página web. Para utilizar este código, pégalo en 'Texto por

encima de la página'.

 

 

body onload=

"window.alert('¡Bienvenid@ a mi página web!')">

 

 

 

 

Mensaje de despedida: este código te permite poner un mensaje al momento de que

el visitante abandona tu página web. Para utilizar este código, pégalo en 'Texto por

encima de la página'.

 

 

<body onUnload=

"window.alert('¡Muchas gracias por tu visita! Nos vemos pronto. ^^')">

 

 

 

 

Deshabilitar clic derecho: este código te permite deshabilitar el clic derecho en tu

página web, de este modo tu contenido estará más seguro. Para utilizar este código,

pégalo en '
Advertencia referente al campo de contenido'.

 

 

<script type="text/javascript" language="Javascript">

document.oncontextmenu = function(){

return false;

}

</script>

 

 

 

 

Deshabilitar selección de texto: este código te permite deshabilitar la selección de

texto en tu página web, para proteger tu contenido. Para utilizar este código,

pégalo en 'Advertencia referente al campo de contenido'.

 

 

<script language="Javascript">

function disableselect(e){

return false;

}

function reEnable(){

return true;

}

document.onselectstart=new Function ("return false");

if (window.sidebar){

document.onmousedown=disableselect;

document.onclick=reEnable;

}

</script>

 

 

 

 

Flechas desplazamiento: este código te permite poner unas flechas para deslizarte

rápidamente por tu página web, además de dar una apariencia mucho más

profesional. Para utilizar este código, pégalo en 'Texto por encima de la página'.

 

<script language="JavaScript" type="text/javascript">


//<![CDATA[


function abajo() {


window.scrollBy(0,20); // velocidad abajo


scrolldelay = setTimeout('abajo()',100); // tiempo


}


function subir() {


window.scrollBy(0,-20); // velocidad subir


scrolldelay = setTimeout('subir()',100); // tiempo


}


function stopScroll() {


clearTimeout(scrolldelay);


}


//]]>


</script><a href="#" title="Ir Abajo" style="display:scroll;position:fixed;bottom:20px;right:20px;" onmouseover="abajo()" onmouseout="stopScroll()"><img src=


"https://img.webme.com/pic/e/editarpaginaweb/nbaj.png" alt="" /></a> <a href="#" title="Ir Arriba" style="display:scroll;position:fixed; bottom:90px;right:20px;" onmouseover="subir()" onmouseout=


"stopScroll()"><img src="https://img.webme.com/pic/e/editarpaginaweb/nsub.png" alt="" /></a>

 

 

 

Flecha subir oculta: este código te permite poner una flecha oculta en tu página

web, pero cuando bajas por la página ésta aparece. Para utilizar este código, pégalo

en 'Texto por encima de la página'.

 

 

<style type="text/css">

/* Flecha subir oculta www.editarpaginaweb.es.tl

----------------------------------------------- */

#IrArriba {

position: fixed;

top: 100px; /* Distancia desde abajo */

right: 10px; /* Distancia desde la derecha */

}

#IrArriba span {

width: 60px; /* Ancho del botón */

height: 60px; /* Alto del botón */

display: block;

background: url(https://img.webme.com/pic/e/editarpaginaweb/nsub.png) no-repeat center center;

}

</style>

<div id='IrArriba'>

<a href='#Arriba'><span/></a>

</div>

<script type='text/javascript'>

//<![CDATA[

// Botón para Ir Arriba

jQuery.noConflict();

jQuery(document).ready(function() {

jQuery("#IrArriba").hide();

jQuery(function () {

jQuery(window).scroll(function () {

if (jQuery(this).scrollTop() > 200) {

jQuery('#IrArriba').fadeIn();

} else {

jQuery('#IrArriba').fadeOut();

}

});

jQuery('#IrArriba a').click(function () {

jQuery('body,html').animate({

scrollTop: 0

}, 800);

return false;

});

});

});

//]]>

</script>

 

 

 

 

Copos de nieve: este código te permite poner copos de nieve en tu página web, y

éstos se van acumulando al final de la página. Para utilizar este código, pégalo en

'Texto por encima de la página'.

 

 

<script type="text/javascript">

//<![CDATA[

// Copos de nieve

/** @license

DHTML Snowstorm! JavaScript-based Snow for web pages

--------------------------------------------------------

Version 1.42.20111120 (Previous rev: 1.41.20101113)

Copyright (c) 2012, www.editarpaginaweb.es.tl

Code provided under the BSD License:

http://www.editarpaginaweb.es.tl/  editarpaginaweb@gmx.es

*/

var snowStorm=function(e,d){function g(a,d){isNaN(d)&&(d=0);return Math.random()*a+d}function o(){e.setTimeout(function(){a.start(true)},20);a.events.remove(i?d:e,"mousemove",o)}function r(){if(!a.excludeMobile||!s)a.freezeOnBlur?a.events.add(i?d:e,"mousemove",o):o();a.events.remove(e,"load",r)}this.flakesMax=128;this.flakesMaxActive=64;this.animationInterval=20;this.excludeMobile=true;this.flakeBottom=null;this.followMouse=true;this.snowColor="#ffffff";this.snowCharacter="&bull;";this.snowStick=true;

this.targetElement=null;this.useMeltEffect=true;this.usePositionFixed=this.useTwinkleEffect=false;this.freezeOnBlur=true;this.flakeRightOffset=this.flakeLeftOffset=0;this.flakeHeight=this.flakeWidth=8;this.vMaxX=5;this.vMaxY=4;this.zIndex=0;var a=this,y=this,i=navigator.userAgent.match(/msie/i),z=navigator.userAgent.match(/msie 6/i),A=navigator.appVersion.match(/windows 98/i),s=navigator.userAgent.match(/mobile/i),B=i&&d.compatMode==="BackCompat",t=s||B||z,h=null,k=null,j=null,m=null,u=null,v=null,

p=1,n=false,q;a:{try{d.createElement("div").style.opacity="0.5"}catch(C){q=false;break a}q=true}var w=false,x=d.createDocumentFragment();this.timers=[];this.flakes=[];this.active=this.disabled=false;this.meltFrameCount=20;this.meltFrames=[];this.events=function(){function a(b){var b=f.call(b),c=b.length;l?(b[1]="on"+b[1],c>3&&b.pop()):c===3&&b.push(false);return b}function d(a,c){var e=a.shift(),f=[b[c]];if(l)e[f](a[0],a[1]);else e[f].apply(e,a)}var l=!e.addEventListener&&e.attachEvent,f=Array.prototype.slice,

b={add:l?"attachEvent":"addEventListener",remove:l?"detachEvent":"removeEventListener"};return{add:function(){d(a(arguments),"add")},remove:function(){d(a(arguments),"remove")}}}();this.randomizeWind=function(){var c;c=g(a.vMaxX,0.2);u=parseInt(g(2),10)===1?c*-1:c;v=g(a.vMaxY,0.2);if(this.flakes)for(c=0;c<this.flakes.length;c++)this.flakes[c].active&&this.flakes[c].setVelocities()};this.scrollHandler=function(){var c;m=a.flakeBottom?0:parseInt(e.scrollY||d.documentElement.scrollTop||d.body.scrollTop,

10);isNaN(m)&&(m=0);if(!n&&!a.flakeBottom&&a.flakes)for(c=a.flakes.length;c--;)a.flakes[c].active===0&&a.flakes[c].stick()};this.resizeHandler=function(){e.innerWidth||e.innerHeight?(h=e.innerWidth-(!i?16:16)-a.flakeRightOffset,j=a.flakeBottom?a.flakeBottom:e.innerHeight):(h=(d.documentElement.clientWidth||d.body.clientWidth||d.body.scrollWidth)-(!i?8:0)-a.flakeRightOffset,j=a.flakeBottom?a.flakeBottom:d.documentElement.clientHeight||d.body.clientHeight||d.body.scrollHeight);k=parseInt(h/2,10)};this.resizeHandlerAlt=

function(){h=a.targetElement.offsetLeft+a.targetElement.offsetWidth-a.flakeRightOffset;j=a.flakeBottom?a.flakeBottom:a.targetElement.offsetTop+a.targetElement.offsetHeight;k=parseInt(h/2,10)};this.freeze=function(){var c;if(a.disabled)return false;else a.disabled=1;for(c=a.timers.length;c--;)clearInterval(a.timers[c])};this.resume=function(){if(a.disabled)a.disabled=0;else return false;a.timerInit()};this.toggleSnow=function(){a.flakes.length?(a.active=!a.active,a.active?(a.show(),a.resume()):(a.stop(),

a.freeze())):a.start()};this.stop=function(){var c;this.freeze();for(c=this.flakes.length;c--;)this.flakes[c].o.style.display="none";a.events.remove(e,"scroll",a.scrollHandler);a.events.remove(e,"resize",a.resizeHandler);a.freezeOnBlur&&(i?(a.events.remove(d,"focusout",a.freeze),a.events.remove(d,"focusin",a.resume)):(a.events.remove(e,"blur",a.freeze),a.events.remove(e,"focus",a.resume)))};this.show=function(){var a;for(a=this.flakes.length;a--;)this.flakes[a].o.style.display="block"};this.SnowFlake=

function(a,e,l,f){var b=this;this.type=e;this.x=l||parseInt(g(h-20),10);this.y=!isNaN(f)?f:-g(j)-12;this.vY=this.vX=null;this.vAmpTypes=[1,1.2,1.4,1.6,1.8];this.vAmp=this.vAmpTypes[this.type];this.melting=false;this.meltFrameCount=a.meltFrameCount;this.meltFrames=a.meltFrames;this.twinkleFrame=this.meltFrame=0;this.active=1;this.fontSize=10+this.type/5*10;this.o=d.createElement("div");this.o.innerHTML=a.snowCharacter;this.o.style.color=a.snowColor;this.o.style.position=n?"fixed":"absolute";this.o.style.width=

a.flakeWidth+"px";this.o.style.height=a.flakeHeight+"px";this.o.style.fontFamily="arial,verdana";this.o.style.overflow="hidden";this.o.style.fontWeight="normal";this.o.style.zIndex=a.zIndex;x.appendChild(this.o);this.refresh=function(){if(isNaN(b.x)||isNaN(b.y))return false;b.o.style.left=b.x+"px";b.o.style.top=b.y+"px"};this.stick=function(){t||a.targetElement!==d.documentElement&&a.targetElement!==d.body?b.o.style.top=j+m-a.flakeHeight+"px":a.flakeBottom?b.o.style.top=a.flakeBottom+"px":(b.o.style.display=

"none",b.o.style.top="auto",b.o.style.bottom="0px",b.o.style.position="fixed",b.o.style.display="block")};this.vCheck=function(){if(b.vX>=0&&b.vX<0.2)b.vX=0.2;else if(b.vX<0&&b.vX>-0.2)b.vX=-0.2;if(b.vY>=0&&b.vY<0.2)b.vY=0.2};this.move=function(){var d=b.vX*p;b.x+=d;b.y+=b.vY*b.vAmp;if(b.x>=h||h-b.x<a.flakeWidth)b.x=0;else if(d<0&&b.x-a.flakeLeftOffset<-a.flakeWidth)b.x=h-a.flakeWidth-1;b.refresh();if(j+m-b.y<a.flakeHeight)b.active=0,a.snowStick?b.stick():b.recycle();else{if(a.useMeltEffect&&b.active&&

b.type<3&&!b.melting&&Math.random()>0.998)b.melting=true,b.melt();if(a.useTwinkleEffect)if(b.twinkleFrame)b.twinkleFrame--,b.o.style.visibility=b.twinkleFrame&&b.twinkleFrame%2===0?"hidden":"visible";else if(Math.random()>0.9)b.twinkleFrame=parseInt(Math.random()*20,10)}};this.animate=function(){b.move()};this.setVelocities=function(){b.vX=u+g(a.vMaxX*0.12,0.1);b.vY=v+g(a.vMaxY*0.12,0.1)};this.setOpacity=function(a,b){if(!q)return false;a.style.opacity=b};this.melt=function(){!a.useMeltEffect||!b.melting?

b.recycle():b.meltFrame<b.meltFrameCount?(b.meltFrame++,b.setOpacity(b.o,b.meltFrames[b.meltFrame]),b.o.style.fontSize=b.fontSize-b.fontSize*(b.meltFrame/b.meltFrameCount)+"px",b.o.style.lineHeight=a.flakeHeight+2+a.flakeHeight*0.75*(b.meltFrame/b.meltFrameCount)+"px"):b.recycle()};this.recycle=function(){b.o.style.display="none";b.o.style.position=n?"fixed":"absolute";b.o.style.bottom="auto";b.setVelocities();b.vCheck();b.meltFrame=0;b.melting=false;b.setOpacity(b.o,1);b.o.style.padding="0px";b.o.style.margin=

"0px";b.o.style.fontSize=b.fontSize+"px";b.o.style.lineHeight=a.flakeHeight+2+"px";b.o.style.textAlign="center";b.o.style.verticalAlign="baseline";b.x=parseInt(g(h-a.flakeWidth-20),10);b.y=parseInt(g(j)*-1,10)-a.flakeHeight;b.refresh();b.o.style.display="block";b.active=1};this.recycle();this.refresh()};this.snow=function(){for(var c=0,d=0,e=0,f=null,f=a.flakes.length;f--;)a.flakes[f].active===1?(a.flakes[f].move(),c++):a.flakes[f].active===0?d++:e++,a.flakes[f].melting&&a.flakes[f].melt();if(c<a.flakesMaxActive&&

(f=a.flakes[parseInt(g(a.flakes.length),10)],f.active===0))f.melting=true};this.mouseMove=function(c){if(!a.followMouse)return true;c=parseInt(c.clientX,10);c<k?p=-2+c/k*2:(c-=k,p=c/k*2)};this.createSnow=function(c,d){var e;for(e=0;e<c;e++)if(a.flakes[a.flakes.length]=new a.SnowFlake(a,parseInt(g(6),10)),d||e>a.flakesMaxActive)a.flakes[a.flakes.length-1].active=-1;y.targetElement.appendChild(x)};this.timerInit=function(){a.timers=!A?[setInterval(a.snow,a.animationInterval)]:[setInterval(a.snow,a.animationInterval*

3),setInterval(a.snow,a.animationInterval)]};this.init=function(){var c;for(c=0;c<a.meltFrameCount;c++)a.meltFrames.push(1-c/a.meltFrameCount);a.randomizeWind();a.createSnow(a.flakesMax);a.events.add(e,"resize",a.resizeHandler);a.events.add(e,"scroll",a.scrollHandler);a.freezeOnBlur&&(i?(a.events.add(d,"focusout",a.freeze),a.events.add(d,"focusin",a.resume)):(a.events.add(e,"blur",a.freeze),a.events.add(e,"focus",a.resume)));a.resizeHandler();a.scrollHandler();a.followMouse&&a.events.add(i?d:e,"mousemove",

a.mouseMove);a.animationInterval=Math.max(20,a.animationInterval);a.timerInit()};this.start=function(c){if(w){if(c)return true}else w=true;if(typeof a.targetElement==="string"&&(c=a.targetElement,a.targetElement=d.getElementById(c),!a.targetElement))throw Error('Snowstorm: Unable to get targetElement "'+c+'"');if(!a.targetElement)a.targetElement=!i?d.documentElement?d.documentElement:d.body:d.body;if(a.targetElement!==d.documentElement&&a.targetElement!==d.body)a.resizeHandler=a.resizeHandlerAlt;

a.resizeHandler();a.usePositionFixed=a.usePositionFixed&&!t;n=a.usePositionFixed;if(h&&j&&!a.disabled)a.init(),a.active=true};a.events.add(e,"load",r,false);return this}(window,document);

//]]>

</script>

 

 

 

 

Pájaro de Twitter: este código te permite poner el pájaro de Twitter que vuela por

toda tu página web, siguiéndote allá donde vayas. Para utilizar este código, pégalo

en 'Texto por encima de la página'.

 

 

<script src="http://oloblogger.googlecode.com/files/tripleflap.js" type="text/javascript"></script>

<script type="text/javascript">

var birdSprite='http://oloblogger.googlecode.com/files/birdsprite.png';

var targetElems=new Array('img','hr','table','td','div','input','textarea','button','select','ul','ol','li','h1','h2','h3','h4','p','code','object','a','b','strong','span');

var twitterAccount = 'URL DE TWITTER AQUÍ';

var twitterThisText ='';

tripleflapInit();

</script>

 

 

 

 

Música de fondo: este código te permite poner cualquier canción de fondo en tu

página web, haciendo de la página un sitio más agradable. Para utilizar este código,

pégalo en 'Texto por encima de la página'.
 

 

 

<BGSOUND SRC="sonido.mid" LOOP=none>  <WIDTH=200 HEIGHT=55 AUTOSTART="true" LOOP="false" HIDDEN="true"></body></html>

 

 

 

 

Luces laterales: este código te permite poner unas luces laterales que cambian de

color sucesivamente, ideal para los diseños Iceblue. Para utilizar este código, pégalo

en 'Texto por debajo de la página'.

 

 

<style>body {

background-image: url(http://photos1.hi5.com/0031/763/432/vr3mEw763432-03.gif);

background-repeat: repeat;

background-position: top center;

background-attachment: fixed;

background-repeat: repeat-y;

}</style>

 

 

 

 

Título box con movimiento: este código te permite poner movimiento a los títulos de

los box de tu página web, exactamente como en nuestra página web. Para utilizar

este código, pégalo donde creas conveniente.

 

 

<marquee>ESCRIBE AQUÍ EL TÍTULO</marquee>

 

 

 

 

Título web con movimiento: este código te permite poner movimiento al título de tu

página web, dando una apariencia aún más profesiona a tu página web. Para utilizar

este código, pégalo en 'Texto por encima de la página'.

 

 

<SCRIPT LANGUAGE="JavaScript"> 

var txt=" TÍTULO WEB AQUÍ "; 

var espera=91; 

var refresco=null; 

function rotulo_title() { 

document.title=txt; 

txt=txt.substring(1,txt.length)+txt.charAt(0); 

refresco=setTimeout("rotulo_title()",espera);} 

rotulo_title(); 

</SCRIPT>

 

 

 

 

Pop up en tu web: este código te permite poner una ventana emergente en tu página

web, además es muy útil para mostrar otra página de tu propiedad. Para utilizar este

código, pégalo en 'Fuente HTML'.

 

 

<script language='JavaScript'>window.open('http://www.esditarpaginaweb.es.tl/', 'geoflotante', '');</script>

 

 

 

Cámara vigilancia: este código te permite poner una cámara en movimiento en tu

página web, mejorando la apariencia de tu página web. Para utilizar este código,

pégalo en 'Texto por encima de la página'.

 

<div style="text-align: center;"><a href="http://www.editarpaginaweb.es.tl/"

 

_fcksavedurl="http://www.editarpaginaweb.es.tl/" style="right: 0px; position:

 

fixed; top: 0px;"><img src="https://img.webme.com/pic/e/editarpaginaweb/camaravigilancia.gif"

 

_fcksavedurl="https://img.webme.com/pic/e/editarpaginaweb/camaravigilancia.gif" alt="" /></a></div>

 

 

 

Box transparentes: este código te permite poner los box de tu página web

transparentes, ideal para los diseños Iceblue. Para utilizar este código, pégalo en

'Texto del 1 box derecha'.

 

 

 <style type="text/css"> <!--

/* Diesen Teil nicht rauslöschen*/

/* Copyright by streetplayer49 http://www.hp-service.de.tl */

/* Allgemein */

 

p, div{color:#ffffff;}

body{color: #ffffff;background-color:#000000;}

 

 

 

/*Navigation*/

td.edit_navi_headbg{background-image: none;width: 15%;}

td.nav_heading{background-image: url(https://img.webme.com/pic/e/editarpaginaweb/realflashdown.gif);height: 33px;padding-left: 27px;font-size: 14px;font-weight: bold;}

td.nav{background-image: none;height: 33px;}

td.nav:hover{background-image: url(http://Hier Bildlink/buttoncpredhov.jpg);height: 33px;}

td.nav a{color: #ffffff;text-decoration: none;font-size: 11px;}

td.nav a:hover{color: #ffffff;text-decoration: overline underline;font-size: 11px;}

td.nav a:visited{color: #ffffff;font-size: 11px;font-weight: bold;}

td.edit_below_nav{visibility: hidden;}

 

/*Content www.editarpaginaweb.es.tl*/

td.edit_rechts_cbg{background-image: none;width: 100%;}

td.edit_content_top{height: 33px;background-image: url(https://img.webme.com/pic/e/editarpaginaweb/realflashdown.gif);font-size:14px;font-weight:bold;text-align: center;}

td.edit_content{background-image: none;background-color:transparent;}

td.edit_content div{color: #fff;font-size: 12px;font-weight: bold;}

td.edit_content p{color: #fff;font-size: 12px;font-weight: bold;}

td.edit_content font{color: #fff;font-size: 12px;font-weight: bold;}

td.edit_content_bottom{background-image: url(https://img.webme.com/pic/e/editarpaginaweb/realflashdown.gif);height: 33px;}

td.edit_content_bottom2{background-image: none;height: 38px;}

td.headline2{visibility: hidden;}

 

/*Rechte Boxen*/

td.sidebar_heading{background-image: url(https://img.webme.com/pic/e/editarpaginaweb/realflashdown.gif);height: 33px;font-size: 14px;font-weight: bold;text-align: center;}

.shouty, .shouty2, .shouty3, .shouty4, .shouty5{background-image: none;background-color: transparent;border: transparent;}

td.edit_rechts_bottom{background-image: none;width: 15%;}

td.edit_rb_footer{background-image: none;}

/*Rechter Streifen*/

td.edit_rechts_sbg{background-image: none;visibility: hidden;position: absolute;right: 0px;}

--> </style> 

 



Este sitio web fue creado de forma gratuita con PaginaWebGratis.es. ¿Quieres también tu sitio web propio?
Registrarse gratis