detodoparaescojer
  CODIGOS HTML
 

¿Quieres escuchar musica mientras lees esta pagina?

http://meriyo.jimdo.com/trucos-y-truquitos/COMO PONER UN PLAYLIST COMO ESTE EN MI PAGINA
 
 
 

Esta sección es para que podáis poner vuestros trucos y sugerencias, que conozcáis para mejorar nuestras web , se publicara, vuestro truco con un enlace a vuestra web y especificando de quien es cada nueva idea.

Voy a empezar yo con algunos  que me parecen bastante divertidos

Al final de esta pagina encontraras como hacer el codigo de objetos cayendo por la web



CODIGO PERSONALIZADO DE CARGAR LA PAGINA

Cuando ponemos mucho contenido, o elementos pesados en cargar com los banner, los flash etc, nuestra pagina se queda parada hasta que carga por lo que nuestros visitantes se pueden aburrir de esperar a que cargue y abandonar nuestra web.

Os voy a dejar un código y la explicacion de como personalizarlo con la imagen que mas te guste para que aparezca al cargar la pagina y cuando ya esta cargada desaparece.

CODIGO HTML

<script type='text/javascript'>
//<![CDATA[
    window.onload = detectarCarga;
    function detectarCarga(){
    document.getElementById("imgLOAD").style.display="none";
    }
    //]]>
</script>
<div id='imgLOAD' style="TEXT-ALIGN:center">
    <b>ESTA CARGANDO LA PAGINA, ESPERA UNOS SEGUNDOS</b>
    <center>
        <img src="" />
    </center>
</div>

Añadele una foto grande y divertida y te hara un efecto de pagina que desaparece

Lo primero que hacemos es poner nuestro propio texto en lo que os he marcado en rojo,( no os olvidéis que cuando la pagina este cargada desaparecerá, tanto el texto como la imagen.)

Elegimos la imagen que queremos que aparezca cuando se este cargando la pagina, tenemos que saber la dirección URL de la imagen, ya he explicado en esta web como saber la dirección URL de una imagen.

Explico un poquito mas abajo en esta misma pagina como se sabe la url de una imagen en los diferentes Navegadors


  • Ahora vamos a ponerla en el código , vamos a <img src="" />, y entre las comillas pegamos la dirección url.

 

EJEMPLO.


<img src="http://u.jimdo.com/www20/o/s9b8e7b427c6eadc9/img/iacad83da5d6aec96/1305048448/std/image.gif" />

Este código nos centra la imagen a la derecha ( center).

Si lo quieres a la izquierda o a la derecha puedes cambiarlo pero siempre con la palabra en ingles ( left o right).

Y ya tenemos un bonito y original código de cargando la pagina.


Poner una imagen en linea para saber la url


Este es un tema del que hablo en diferentes paginas de mi web, doy por hecho que todo el mundo sabe que no se copia la url  una imagen directamente de ninguna web, o blog que no sea la tuya.

Tambien explicar, que si  se copia el contenido de una pagina web o blog( sin consentimiento de su autor),, para ponerlo en la suya, se considera Plagio, se deben hacer los temas a nuestra manera y aprender del trabajo  que nos ofrecen los demas, para asi disfrutar del nuestro

Fallo mio pensar eso ya que quizás much@s no sepáis que NO SE COPIA , ni la url de las imagenes de otros siios en la red, ni el contenido de sus paginas

Vamos paso a paso para saber como utilizar una imagen

Hay paginas que ofrecen imagenes o gif gratuitos, y a ti te interesa uno para ponerlo en la tuya.
Lo que hacemos

  • Botón derecho del ratón sobre la imagen.
  • Guardar imagen en tu PC.
  • Subir a tu pagina, o alojarla en un host de imagenes gratuito ( te da la url de la imagen).
  • Ya puedes saber la direccion url de la imagen como os explico a continuación.
  • Como todo lo que se baja de la red, revisar por si tiene virus
  • Recordar que no se copia la url de la imagen de ninguna web o blog.....

Como se la url de la imagen en los diferentes navegadores

¿ que es la url de una imagen?

La url de la imagen para que todos me entendeis es como si fuera un nombre propio , cada imagen tiene uno, y para los codigos que queramos que aparezca una imagen siempre nos pediran la identidad de esta, es su manera de identificarla

Aunque ya lo he explicado en muchas ocasiones, se que algunos teneis dificultad en saber y encontrar la url de una imagen para poner en los codigos, como cada navegador tiene una opcion diferente os unos cuantos y asi os sera super sencillo poner la url de la imagen

  • Con Internet Explorer. Botón derecho del ratón sobre la imagen,  nos abrirá un cuadro en el que al final veremos propiedades, bueno pues esa es la url de la imagen que se copia y pega en el lugar del código que te solicitó una url de imagen.
  • Con Google Chrome.Al hacer click con el ratón sobre la imagen, veremos como un  cuadrito ( menú contextual) y pone copiar la url de la imagen.
  • Con Safari puedes copiar enlace.
  • Con Mozilla es copiar ruta de imagen

 

Texto dentro de cajitas de colores

COSAS INTERESANTES PARA TU WEB

Vamos a aprender a modificar este codigo a nuestro gusto y nos quedara algo mas original y bonito, que es de lo que se trata.

Asi que vamos a hacer de un simple codigo, uno algo mas complejo y vistoso.

Os ponder tambien el codigo para que al pinchar en la cajita nos lleva a otra pagina o a otra web


<table width="000" border="1" bgcolor="#FFCCFF">
    <tr>
        <td>
            COSAS INTERESANTES PARA TU WEB
        </td>
    </tr>
</table>

Primer paso

Ahora voy a modificar el codigo de manera que se quede a mi gusto, no solo voy a cambiar el texto y el color, sino que voy a añadirle mas cajitas con texto para eso hago lo siguiente.

Copio el codigo original y lo pego debajo del que acabo de poner, y le modifico el texto el color y esta vez tambien el tamaño.


<table width="000" border="1" bgcolor="#FFCCFF">
    <tr>
        <td>
            COSAS INTERESANTES PARA TU WEB
        </td>
    </tr>
</table>

<table width="400" border="1" bgcolor="#FFCC33">
    <tr>
        <td>
            TRUCOS, PROGRAMAS, CODIGOS, AYUDA ON-LINE...
        </td>
    </tr>
</table>

Segundo paso

Podemos añadir todas las lineas que queramos, y cambiar el tamaño el texto y el color.

Pero ¿por que no hacemos que en algunas cajitas el texto aparezca en movimiento....?

Vamos a ello.

Para los que leis mi web habitualmente ya sabeis como se pone un codigo con texto en movimiento, es tan sencilo como  poner el texto dentro de las etiquetas <marquee></marquee>, que es lo que voy a hacer ahora con el texto de el codigo, al que quiero que se mueva le pongo delante y detras( de mi texto) <marquee>.

            <marquee>DALE AL BOTON DE ME GUSTA, ME ANIMA A CONTINUAR TRABAJANDO, PARA MEJORAR NUESTRAS WEB</marquee>

Acuerdate que todo el texto que metas entre esas etiquetas saldra en movimiento.

Asi el resultado final de mi codigo seria este..

Resultado final

PARTICIPA EN MI WEB
TRUCOS, PROGRAMAS, CODIGOS, AYUDA ON-LINE...
PARTICIPA EN MI WEB PARA OBTENER TU BANNER O FONDO PERSONIFICADO
DALE AL BOTON DE ME GUSTA, ME ANIMA A CONTINUAR TRABAJANDO, PARA MEJORAR NUESTRAS WEB
GRACIAS POR TU VISITA

Codigo

<table width="200" border="1" bgcolor="#FFCCFF">
    <tr>
        <td>
            <marquee>PARTICIPA EN MI WEB</marquee>
        </td>
    </tr>
</table>

<table width="400" border="1" bgcolor="#FFCC33">
    <tr>
        <td>
            TRUCOS, PROGRAMAS, CODIGOS, AYUDA ON-LINE...
        </td>
    </tr>
</table>

<table width="600" border="1" bgcolor="#99CC33">
    <tr>
        <td>
            PARTICIPA EN MI WEB PARA OBTENER TU BANNER O FONDO PERSONIFICADO
        </td>
    </tr>
</table>

<table width="800" border="1" bgcolor="#CEE3F6">
    <tr>
        <td>
            <marquee>DALE AL BOTON DE ME GUSTA, ME ANIMA A CONTINUAR TRABAJANDO, PARA MEJORAR NUESTRAS WEB</marquee>
        </td>
    </tr>
</table>

<table width="400" border="1" bgcolor="#CC99FF">
    <tr>
        <td>
            GRACIAS POR TU VISITA
        </td>
    </tr>
</table>

Ahora le vamos a añadir un enlace, para hacer que al pinchar en la cajita, podamos desplazarmos a doferentes paginas, vamos a ello

Vamos a añadir una linea al codigo que nos haga crear un enlace.

<a href="AQUI LA URL DE LA IMAGEN"></a>

Las direcciones url empiezan con http:// y luego el nombre de la pagina, se pueden ver en la parte de arriba del navegador, en tu web Jimdo debes copiarla cuando estes en Vista Previa o con la sesion cerrada, si la copias y la pegas cuando estas editando la web los enlaces no funcionaran. 

 CODIGO DE CAJITA CON ENLACE


<table width="170" border="1" bgcolor="#FFCC33">
<tr>
<td>
<a href="Aqui la url de la pagina"><marquee>AQUI EL TITULO</marquee></a>
</td>
</tr>
</table>


Ahora ya es cosa vuestra ser mas o menos creativos ya que como veis tiene muchas posibilidades.....

Como todo lo que aqui pongo espero que os guste

Como hago un codigo personalizado para decorar mi pagina

 
 
IMAGEN QUE UTILIZO PARA EL CODIGO

Hoy os voy a enseñar como hacer un código para que aparezcan imagenes decorando nuestra pagina.

  • Lo primero que hacemos es seleccionar la imagen que vamos a poner en el código yo he elegido una de unos ojos rojos.
  • Como ya os he explicado muchas veces, para saber la dirección URL de una foto tiene que estar on-line.
  • Es decir tiene que estar publicada en internet, si es una foto propia la subimos a nuestra web y si no la alojamos en un hosting de imagenes ( jimdo hace poco nos ofrecía uno se llama Dropbox), te da la opción de hospedar la foto al subir una imagen.
  • Una vez la foto en linea, ponemos el ratón encima le damos al lado derecho y te aparece la dirección URL de la foto.

Dicho esto vamos al código
Vamos a poner todo el contenido del código entre el atributo div ' asi que el código es
<div style="text-align: center;">
    <a href="" style="center: 0px; position: fixed; top: 0px;"><img src="" alt=
    "" /></a>
</div>
Aqui lo que he puesto es el estilo del código, su tamaño, su posición, pues vamos a completarlo juntos.
img src="" alt( entre las comillas no hay nada y hay tenemos que poner la dirección url de la foto o gif que ya tengamos decida en mi caso es esta.
http://u.jimdo.com/www30/o/sd503c4244c1edaa9/img/i8f8eee6f1b8fb780/1308235790/std/image.gif
Y así me quedaría el código
<div style="text-align: center;">
    <a href="" style="center: 0px; position: fixed; top: 0px;"><img src="http://u.jimdo.com/www30/o/sd503c4244c1edaa9/img/i8f8eee6f1b8fb780/1308235790/std/image.gif" alt=
    "" /></a>
</div>
Vale, ahora vamos a darle en enlace a nuestro código, como lo hacemos????, pues muy sencillo pones la dirección url de tu web a la dirección que quieras que vayan cuando pinchen en la imagen
La mía es http://meriyo.jimdo.com/, así que esto lo tengo que poner a href="" style ( dentro de las comillas).
Así el codigo completo
<div style="text-align: center;">
    <a href="http://meriyo.jimdo.com/" style="center: 0px; position: fixed; top: 0px;"><img src="http://u.jimdo.com/www30/o/sd503c4244c1edaa9/img/i8f8eee6f1b8fb780/1308235790/std/image.gif" alt=
    "" /></a>
</div>
Pero no os parece un poco sencillo?????.
Vamos a hacerlo diferente y mas original.Ahora voy a cambiar la posición y el tamaño
<div style="text-align: left;">
    <a href="http://meriyo.jimdo.com/" style="left: 0px; position: fixed; top: 0px;"><img src="http://u.jimdo.com/www30/o/sd503c4244c1edaa9/img/i8f8eee6f1b8fb780/1308235790/std/image.gif" alt=
    "" /></a>
</div>
Una mas

<div style="text-align: right;">
    <a href="http://meriyo.jimdo.com/" style="right: 50px; position: fixed; top: 50px;"><img src="http://u.jimdo.com/www30/o/sd503c4244c1edaa9/img/i8f8eee6f1b8fb780/1308235790/std/image.gif" alt=
    "" /></a>
</div>
Puedes repetir esta accion todas las veces que quieras que aparezca la imagen, y en un mismo codigo puedes poner diferentes imagenes

Asi quedaria el codigo completo CON UN OJITO A CADA LADO

 

<div style="text-align: left;">
    <a href="http://meriyo.jimdo.com/" style="left: 0px; position: fixed; top: 0px;"><img src="http://u.jimdo.com/www30/o/sd503c4244c1edaa9/img/i8f8eee6f1b8fb780/1308235790/std/image.gif" alt=
    "" /></a>
</div>

<div style="text-align: right;">
    <a href="http://meriyo.jimdo.com/" style="right: 50px; position: fixed; top: 50px;"><img src="http://u.jimdo.com/www30/o/sd503c4244c1edaa9/img/i8f8eee6f1b8fb780/1308235790/std/image.gif" alt=
    "" /></a>
</div>

Texto en movimiento con color personalizado

meriyo.jimdo.com

Ya os he explicado como hacer un sencillo codigo de texto en moviniento utilizando  la etiqueta <marquee </marquee>.

Bueno pues hoy vamos a darle un poco de color a nuestro texto, lo que voy ha hacer es añadir un par de etiquetas mas al codigo para darle un aspecto diferente.

<marquee scrolldelay="700" scrollamount="400">
<font color="red"><b>Texto en forma de blink</b></font>
</marquee>

Lo que he hecho es cambiarle el movimiento y el color añadiendo lo que esta en rojo, asi quedaria de esta manera.

GRACIAS POR VISITAR MI WEB

AHORA LO PERSONALIZAMOS COMO MAS NOS GUSTE

Ahora solo  es modificar el movimiento y el color, asi se puede poner como mejor nos quede en nuestra web,  os enseño como queda el codigo modificado y no olvideis que el nombre de los colores tienen que ponerse en ingles.

<marquee scrolldelay="900" scrollamount="700"><font color="black"><b>GRACIAS POR VISITAR MI WEB</b></font></marquee>

GRACIAS POR VISITAR MI WEB

Vale, esta bien...pero yo quiero un texto que ademas suba o baje y ponerle el color

HOLA A TOD@S LOS QUE VEIS MI WEB

Sin salirmos de la ETIQUETA marquee, vamos a cambiar un poco el codigo.

<marquee behavior="" direction="down" scrollamount="1" height="10"><font color="magenta">HOLA A TOD@S LOS QUE VEIS MI WEB</font></marquee>

Lo que he hecho es añadir la posicion del texto, si queremos que vaya en otra posicion , solo debemos modificar esto (down), por la posicion que nos interes por ejemplo arriba seria ( up)  y cambiar su movimiento y su color. y ahora lo que voy a hacer es cambiarle el efecto a texto parpadenate solo modificando eso (scrollamount="1), cuanto mas aumentes el munero mas rapido ira el texto

Asi quedaria el codigo

<marquee behavior="" direction="up" scrollamount="6" height="20"><font color="blue">aqui tu texto</font></marquee>

MERIYO

Como hago una foto con enlace en html

Los que tenemos una web Jimdo tenemos la suerte de poder subir imagenes solo con el menu de edicion, al igual que poner enlaces, subir textos o elementos en flash.

Eso en mi caso que yo uso Jimdo como servidor de mi web, nos hace un poco comodones y muchas veces nos quedamos con las opciones que nos da la pagina.

Pero si yo quiero una imagen propia que enlace en mi web, y si quiero un texto diferente para mis titulos, y si quiero un enlace en mi titulo, y si y si......,

Voy a hacer algo diferente con mi web y para eso lo primero que tengo que saber es como hago una imagen en html.

Imagen en html

<img src="URL DE LA FOTO" alt="" />

Ese es el codigo, an sencillo y facil como esto, acordaos que cuando en un codigo veias img ( es la etiqueta para la imagen), un poquito mas adelante cuando ya sepamos hacer codigos sencillos os explicare los atributos basicos para darles estilos diferentes a las imagenes en HTML.

Asi que ahora vamos con algo sencillito.

Pongo la foto en html

Ahora creamos un enlace en html

<a href="Url de donde quieras enlazar la foto/"></a>

Ya solo nos queda unir los dos codigos y tendremos una imagen enlazada con un codigo html, que podemos dejar visible en nuestra web para que nos enlacen, si pinchas en la foto veras que te lleva a otra web

Codigo entero

<a href="URL DE LA WEB"><img src="URL DE LA IMAGEM" alt="" /></a>

Sirve para publicitar nuestras web, que nos enlacen, vale para todo tipo de archivos de imagen, jpg, gif y png, y lo mas importante es que lo hacemos a nuestro gusto

CODIGO ENLACEN MI WEB

Con un poquito de imaginacion y tiempo podemos hacer cosas muy vistosas para que otras web, presenten nuestra pagina, daros cuenta que cuanto mas nivel adquiramos para nuestro sitio, mas nos pediran enlazarmos desde web con mucho trafico.

 

Codigo

<a href="URL DEL ENLCE"><img src="URL DE LA FOTO" alt="" /></a>

 

EL CODIGO DE MI BANNER ES ESTE:

<script src="http://h1.flashvortex.com/display.php?id=2_1337115093_48901_774_18719_728_90_10_1_14" type="text/javascript"></script>

 

Si te apetece seguir mi web copia y pega este codigo

<a href="http://www.meriyo.jimdo.com" target="_blank"><img src="http://u.jimdo.com/www20/o/s9b8e7b427c6eadc9/img/i80ad7d6a5d504f60/1337088555/std/http-meriyo-jimdo-com-mas-cosas.gif" alt="" /> Seguir a Meriyo</a>

 

AHORA DENTRO DE UNA CAJITA

Podemos ponerlo dentro de una cajita y solo se tendra que copiar el codigo que hay dentro de ella, y asi ya nos pueden enlazar

Codigo

<span id="Caja1" class="Caja1"><a href="AQUI LA URL DEL ENLACE" target="_blank"><img src="AQUI LA URL DE LA IMAGEN" border="0"alt="" /></a><br /></span> 
<textarea onclick="&lt;p&gt;&#160;&lt;span class=" style="display: inline! important; float: none; word-spacing: 0px; font: 12px/18px Arial, Helvetica, sans-serif; text-transform: none; color: #000000; text-indent: 0px; white-space: normal; letter-spacing: normal; orphans: 2; widows: 2;">


 

Si queremos añadirle texto, y mas de una image al codigo teneis que ir a la pagina de esta web

Como alinear varias imagenes en una sola

Me encantaria que me mandarais algun codigo hecho por vosotros

 

Truco cuatro imagenes a diferentes lados de tu web

Algunas veces , cuando piensas en algo que te gustaría hacer para tu web, y no encuentras la manera y la explicaciones que vemos ( no es que estén mal), pero al no saber mucho, no nos enteramos de NA de NA, es ahí cuando dices, " lo voy a hacer yo", y vas a por uvas y te coges manzanas, pues esta es la historia de este código, que no esta hecho para este fin, pero como no me salia lo que quería hacer, pensé....., pero mira que chulo queda así......Después del rollo, el código

Codigo de dos imagenes de ñukis al aldo izquierdo de mi web

<a href='http://meriyo.jimdo.com/trucos-y-truquitos/'><img border='0' src='http://i43.tinypic.com/2u9k6r4.gif' style='position:fixed; top:0; right:20;' title='Besitos' alt="" /></a><a href='http://meriyo.jimdo.com/trucos-y-truquitos/'><img border='0' src='http://i43.tinypic.com/2u9k6r4.gif' style='position:fixed; bottom:0; right:20;' title='MUAA' alt="" /></a>

 

Modificar el codigo

Este código lo vamos a utilizar para poner imagenes que nos acompañen toda la pagina, tanto a derecha como a izquierda, y  tanto arriba como abajo, lo único que tenéis que hacer es poner la dirección url de la imagen( es lo que he puesto en rojo), que queréis que aparezca ( OJO LAS WEB DE JIMDO, de poner una imagen demasiado grande , que tape el inicio de sesión)..Podéis cambiar el texto y el enlace(es lo que esta en azul) por el vuestro, y ya tendrias el código listo para poner en tu web.Ahora ya dejo como siempre a vuestra imaginacion el sacarle el máximo partido a este código y os pongo el código entero de los ñukis besitos, para que aparezcan a los cuatro lados de tu pagina

Que os guste chic@s y si es asi hablar bien de mi web......

 

 

 

Codigo de dos imagenes de ñukis al lado derecho de mi web

<a href='http://meriyo.jimdo.com/trucos-y-truquitos/'><img border='0' src='http://i43.tinypic.com/2u9k6r4.gif' style='position:fixed; bottom:0; right:0;' title='MUAA' alt="" /></a><a href='http://meriyo.jimdo.com/trucos-y-truquitos/'><img border='0' src='http://i43.tinypic.com/2u9k6r4.gif' style='position:fixed; top:0; right:0;' title='Besitos' alt="" /></a>

Codigo de cuatro imagenes de ñukis en cuatro lados de mi web

<a href='http://meriyo.jimdo.com/trucos-y-truquitos/'><img border='0' src='http://i43.tinypic.com/2u9k6r4.gif' style='position:fixed; bottom:0; right:0;' title='MUAA' alt="" /></a><a href='http://meriyo.jimdo.com/trucos-y-truquitos/'><img border='0' src='http://i43.tinypic.com/2u9k6r4.gif' style='position:fixed; top:0; right:0;' title='Besitos' alt="" /></a>

<a href='http://meriyo.jimdo.com/trucos-y-truquitos/'><img border='0' src='http://i43.tinypic.com/2u9k6r4.gif' style='position:fixed; top:0; right:20;' title='Besitos' alt="" /></a><a href='http://meriyo.jimdo.com/trucos-y-truquitos/'><img border='0' src='http://i43.tinypic.com/2u9k6r4.gif' style='position:fixed; bottom:0; right:20;' title='MUAA' alt="" /></a>

 

 

Como cambio el tamaño a una imagen

Hace poco me preguntabais , como se cambia el tamaño de una imagen y hoy que tengo un ratito os lo voy a explicar, que como todas las cosas que pongo en esta web es muy facil de hacer

Lo primero que debeis recordar es que la imagen tiene que estar on-line, para que podais saber su url ( ya os he contado un poquito mas arriba de esta misma pagina como saberlo.

Una vez elegida la foto vamos a usar este codigo, que nos servira tanto para hacer una imagen mas grande, o mas pequeña, segun nos interese

Codigo para cambiar de tamaño una imagen

<img src="AQUI LA URL DE LA IMAGEN"    width="AQUI EN NUMEROS EL ANCHO DE LA IMAGEN"  height="AQUI EN NUMEROS EL ALTO DE LA IMAGEN" alt="" />

Codigo del ejemplo que os pongo

<img src="Aqui la url de la imagen" width="800" height="240" alt="" />

Si  te gusta esta imagen para el codigo la puedes encontrar AQUI

Imagenes en movimiento en html

Mi ya amigo, Juan Carlos que tiene una web Jimdo en la que esta trabajando mucho (http://iglesiadedioshaina.jimdo.com/) y además  es super buena gente.

Me ha preguntado como pone imagenes en html en movimiento, así que lo voy a explicar para que sea fácil hacerlo.
Ya sabemos como poner una imagen en html, ya sabemos hacer un banner con imagenes en movimiento y ponerlo con enlace a donde queremos, también sabemos como darle movimiento a un texto, así que esto es tan sencillo como , poner nuestras ya conocidas etiquetas

.<marquee></marquee>

Y entre ellas vamos a poner el código html de la imagen que queramos poner, yo para el ejemplo voy a utilizar esta que esta en gif

Codigo de imagen fija

<img src="Url de la imagen" alt="" />

Si os gusta el codigo con esta imagen. os dejo el link donde podeis encontrarla para ponerla en el codigo

AQUI

Ahora el codigo de foto lo ponemos entre las etiquetas marquee

CODIGO

<marquee><img src="http://u.jimdo.com/www20/o/s9b8e7b427c6eadc9/img/i8beb795308ab9de5/1311163294/thumb/image.gif" alt="" /></marquee>

Ahora con texto

Siempre sin salirmos de la etiqueta que estamos utilizando, añadimos el texo que queramos que aparezca en moviento en la foto, le damos otro movimiento( rigth) a la imagen y algo de velocidad

 

Codigo

<marquee direction="RIGHT" scrollamount="8"><img src="aqui la url de la imagen" alt="" />TU TEXTO AQUI</marquee>

Si te gusta la imagen de este codigo la tienes AQUI

ESPERO QUE OS GUSTE

Cambiar el texto que aparece en la foto

Para cambiar el texto que aparece en la imagen, podemos añadirle las etiquetas correspondientes, en la seccion de como hago, modifico y edito mi plantilla, podeis ver la cantidad de cosas que podemos hacer con el texto.

Ahora os dejo un ejemplo, juntando varias etiquetas marquee y cambiando el texto


Codigo

<!-- Inicio enlace meriyo.jimdo.com --><marquee direction="RIGHT"><img src="http://u.jimdo.com/www7/o/s9ef11cd6999540f3/img/i19cc132fbf22155a/1337262168/std/image.gif" alt="" /></marquee><h1>    <marquee hspace="50" vspace="30"><a href="http://meriyo.jimdo.com/codigos/codigos-divertidos/" target="_blank"><img src=    "http://u.jimdo.com/www7/o/s9ef11cd6999540f3/img/iac06d873a0e56a1f/1337262533/std/http-meriyo-jimdo-com-codigos-codigos-divertidos.gif" alt="" /></a><strong><a href=    "http://meriyo.jimdo.com/codigos/codigos-divertidos/" target="_red">Sorpresa!!!!</a></strong></marquee></h1><!-- Final enlace meriyo.jimdo.com -->

Esto es un animagif

meriyo.jimdo.com

Un aminagif es una buena , divertida y muy poco pesada en cargar para poner en el encabezado( SE SUBE AL ENCABEZADO DE LAS WEB JIMDO COMO IMAGEN PROPIA), de nuestras paginas, a veces nos complicando subiendo archivos demasiado pesados cuando con un archivo de imagen podemos hacer algo deferente.

Ya os explique en otra de mis paginas como hacerlo, si no lo recuerdas Pincha AQUI, y si quieres banners y encabezados gratis para tu pagina entonce toca pinchar AQUI

¿Como se cuantas personas hay on-line en cada pagina de mi web?

Os voy a dejar un sencillo y efectivo codigo para saber cuantas personas estan on.line en cada pagina de tu web.

Solo tienes que copiar y pegar el codigo que os dejo a continuacion al final ( o donde quieras), de cada pagina diferente de tu web.

CODIGO

Podeis encontrar este y mas en esta pagina

<script>var _wau = _wau || []; _wau.push(["tab", "5s91fryulwbl", "v80", "left-middle"]);(function() { var s=document.createElement("script"); s.async=true; s.src="http://widgets.amung.us/tab.js";document.getElementsByTagName("head")[0].appendChild(s);})();</script>

Poner un fondo interactivo o que cambie en mi web

Seguro que ya lo habreis visto porque este codigo es facil de encontar, pero que significa y como lo amoldo a mis necesidades, siempre que veais el termino backgrounddebemos saber que es el atributo que se utiliza en HTML, para establecer la imagen de fondo ya que dicho atributo, indicaremos la ruta donde esta el archivo (URL)

Vamos a darle movimiento a este codigo

Aqui voy a dejar uno de estos truquillos que tanto me gustan ya que permite hacer cosas diferentes con mi web.

Anibal, me pregunto ayer como habia hecho una imagen de fondo de mi web interactiva ( podeis ver el ejemplo aqui )y yo os lo voy a explicar a todos , pero con especial cariño a el que desde casi el principio de esta web me ha apoyado con sus comentarios.)

Asi que como dicen los toreros.....

Va por usted

Codigo para cambiar el fondo de mi web

<style type="text/css">
/*<![CDATA[*/
<!--

.body {background-image: url(http://jpg); }

-->
/*]]>*/
</style>

Efecto texto que solo aparece al pasar el raton

Pasa el raton por este texto PARA VER SU EFECTO

CODIGO

<a style="cursor: help">AQUI EL TEXTO QUE DESEES QUE TENGA ESTE EFECTO</a>

Personalizar el Codigo de subir pagina

Para personalizar el codigo de subir pagina, lo unico que hacemos es cambiar lo que os voy a marcar en rojo en el codigo .

Si quereis mas codigos ya hechos de subir pagina PINCHAR AQUI

Codigo

<a href='#' title='SUBIR'><img src='Url de la imagen' border='0' alt="" /></a><p>    SUBIR</p>.

El texto de subir que os he marcado en rojo dentro del codigo, es el que podemos cambiar por el que mas nos guste( Ir arriba, Subir pagina....)
Ademas con la etiquetas marquee, que os he enseñado podeis darle movimiento al titulo,


 

Aqui os dejo unos codigos que he hecho con mucho afecto para vosotros que tanto apoyais esta web

Codigo de subir la pagina

<a href='#' title='Ir arriba'><img src='http://u.jimdo.com/www43/o/s80bbe8d6265e2374/img/iaf6233296762621f/1336780295/std/http-meriyo-jimdo-com-trucos-y-truquitos.gif' border='0' alt="" /></a>

 

<a href='#' title='Ir arriba'><img src='http://u.jimdo.com/www43/o/s80bbe8d6265e2374/img/i63f108a27180bfec/1336780311/std/http-meriyo-jimdo-com-trucos-y-truquitos.gif' border='0' alt="" /></a>

 
blue

 

 <div style="img-align: center;">    <a href="#"><img src="http://u.jimdo.com/www43/o/s80bbe8d6265e2374/img/i8437695dbe3486e0/1336780318/std/http-meriyo-jimdo-com-trucos-y-truquitos.gif" alt="blue" /></a></div>

 

<a href='#' title='Ir arriba'><img src='http://u.jimdo.com/www43/o/s80bbe8d6265e2374/img/ibe2d802ceabe7b39/1336780654/std/http-meriyo-jimdo-com-trucos-y-truquitos.gif' border='0' alt="" /></a>

 

Como hago un codigo de objetos cayendo por mi web

meriyo.jimdo.com

En mas de una ocasión me habéis pedido algún código de corazones cayendo por la web, o de nieve,  de estrellas y he puesto en cada apartado el código correspondiente, ahora Angela que tiene un blog muy bonito, me ha pedido un código de lluvia cayendo por la web.Así que como me parece un tema interesante voy a explicar de que manera hacemos para que caigan objetos por la web.

Lo que voy a poner a continuación es el código que usaremos y como ir modificando a nuestro gusto, es un código que empieza  y acaba( como  casi todo que tenga movimiento en html) con la etiqueta <marquee> </marquee>

Codigo que voy a utilizar

<marquee behavior="scroll" direction="down" style="position: absolute; left: 100px; top: 0px; width: 16px; height: 700px;" scrollamount="5"><span style="color: #fff;"></span></marquee>

 

Explicacion facilita del codigo de objetos cayendo por la pagina

Añadiendo las etiquetas necesarias para crear un objeto que caiga ( down), en la posición que yo decida, y que su caída y tamaño por la web tenga x sección de caída (px)  y x tamaño (width y heigt) hasta que lugar de la web quiero que baje el objeto), definiendo la velocidad de bajada y el color del objeto

Vamos a probar ahora el código añadiéndole un unicode, resumiendo  (  un unicode es un símbolo para añadir a nuestro código determinados caracteres o iconos, ).

Por ejemplo os voy a poner el del efecto de nieve, es solo el unicode ya que para darle el efecto de nieve tendríamos que darle el color blanco

*

Ahora le voy a cambiar el color

<span style="color: #FF0000">*</span> <span style="color: #FF00FF">*</span>

 

* *

Os dejo unos unicodes para que vayais probando con ellos

Unicode de Cozazon, estrella, musica, diamantes, treboles

   

Para ponerlos en tu código solo tienes que copiarlos y pegarlos en el lugar correspondiente que ahora os indicare.

Podéis encontrar mas en  ;    http://www.okelmann.com/homepage/unicode.htm

Os pongo el ejemplo del codigo con unicode de corazon

<marquee behavior="scroll" direction="down" style="position: absolute; left: 100px; top: 0px; width: 36px; height: 700px;" scrollamount="15"><span style="color: #FF0000">♥</span></marquee>

Esta seria la primera linea, así que añadiendo, lineas como esta al código, cambiándole posición, velocidad, color y unicode, hemos hecho el primer código con unicodes de cayendo objetos por la web.

AÑADE  unas cuantas lineas mas, con unicodes diferentes , diferentes colores, velocidad etc... Y LISTO

Y ahora podeis pensar

VALE, MUY BIEN PERO YO QUIERO UNA IMAGEN PARA UN EFECTO CONCRETO

Si quieres como en este caso Angeles, hacer un efecto de lluvia, deberemos modificar el código para poder añadir gotas de lluvia.

Yo voy a hacer el ejemplo con unas mariposas

.Lo que hago es cambiar  el lugar donde ponía el unicode ponerle la imagen que yo decida.

Así que añado esto al código<img src="AQUI URL DE LA IMAGEN SELECCIONADA" alt="" />

CAMBIO SU TAMAÑO POSICION ETC ETC Y ASI ME QUEDARIA EL CODIGO

Codigo de mariposas de colores volando por la pagina

ESTA ES SOLO UNA LINEA DEL CODIGO AÑADE TODAS LAS QUE QUIERAS

Recuerda que ienes que cambiar, velocidad, posicion, anchura y altura como os he explicado antes.

Os he marcado en rojo los valores numericos que debeis cambiar.

Si os resulta muy complicado o latoso de hacer...... Os he preparado AQUI, un monton de codigos nuevos

<marquee behavior="scroll" direction="down" style="position: absolute; left: 100px; top: 200px; width: 616px; height: 700px;" scrollamount="5"><span style="color: #FF0000"><img src="http://u.jimdo.com/www20/o/s9b8e7b427c6eadc9/img/i194b470e00022ea3/1302967049/thumb/image.gif" alt="" /></span></marquee> 

VER CODIGO COMPLETO

Efecto CORAZONES cayendo por la web

 A mi es un efecto que  me gusta mucho ya que podemos hacer que caigan diferentes imagenes a la vez,e incluso  texto, así que empezar a hacer cosas divertidas y porque no originales para nuestras web y blog.

VER EFECTO DE CORAZONES CAYENDO POR LA WEB

Para obtener este efecto solo tenéis que quitar la imagen o el unicode y añadirle el texto que queráis.

 

 
 
  Hoy habia 3 visitantes (3 clics a subpáginas) ¡Aqui en esta página!