Agregar un Rastro de Texto al Cursor, Classic Blogger

Con el siguiente código se puede añadir al cursor un rastro de texto, al texto se le puede modificar el color, la fuente, tamaño y velocidad, las indicaciones para las modificaciones están dentro del código.

El código se tiene que colocar después de la etiqueta <head>. (No olvidar hacer un respaldo de la plantilla).

  1. <!-- ONE STEP TO INSTALL RIPPLE TEXT: 1. Copy the coding into the HEAD of your HTML document -->
  2.  
  3. &lt;!-- STEP ONE: PEGAR EL CODIGO DEBAJO DE LA ETIQUETA  en tu documentos html (Plantilla) --&gt;
  4.  
  5. <!-- The JavaScript Source!! http://javascript.internet.com -->
  6. <!-- Ripple Text by kurt.grigg@virgin.net -->
  7.  
  8. &lt;!-- Begin
  9. //Aqui se escribe el texto que va a seguir al mouse
  10. msg='Escribir texto aquí!';
  11. //Aqui se especifica la fuente del texto
  12. font='Verdana,Arial';
  13. size=2; // // solo valores entre 1 y 7!!
  14. //Aqui el color
  15. color='#0000ff';
  16. //Aqui la velocidad
  17. speed=0.5;
  18.  
  19. //A partir de aqui no alterar nada!!
  20. ns=(document.layers);
  21. ie=(document.all);
  22. msg=msg.split('');
  23. n=msg.length;
  24. a=size*10;
  25. ymouse=0;
  26. xmouse=0;
  27. scrll=0;
  28. props=&quot;<font face="+font+" size="+size+" color="+color+">";
  29. if (ns){
  30. for (i=0; i &lt; n; i++)
  31. document.write(''+props+msg[i]+'</font>');
  32. }
  33. if (ie){
  34. document.write('<div id="outer"><div>');
  35. for (i=0; i &lt; n; i++)
  36. document.write('<div id="iemsg" style="height:'+a+';width:'+a+';text-align:center">'+props+msg[i]+'</font></div>');
  37. document.write('</div></div>');
  38. }
  39. (ns)?window.captureEvents(Event.MOUSEMOVE):0;
  40. function Mouse(evnt){
  41. ymouse = (ns)?evnt.pageY+20-(window.pageYOffset):event.y+20;
  42. xmouse = (ns)?evnt.pageX+20:event.x+20;
  43. }
  44. (ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse;
  45. y=new Array();
  46. x=new Array();
  47. Y=new Array();
  48. X=new Array();
  49. for (i=0; i &lt; n; i++){
  50. y[i]=0;
  51. x[i]=0;
  52. Y[i]=0;
  53. X[i]=0;
  54. }
  55. function assign(){
  56. if (ie) outer.style.top=document.body.scrollTop;
  57. for (i=0; i &lt; n; i++){
  58. var d=(ns)?document.layers['nsmsg'+i]:iemsg[i].style;
  59. d.top=y[i]+scrll;
  60. d.left=x[i]+(i*(a/2));
  61. }
  62. }
  63. function ripple(){
  64. scrll=(ns)?window.pageYOffset:0;
  65. y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed);
  66. x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed);
  67. for (var i=1; i

Este efecto funciona con Internet Explorer, ejemplo.

Artículos Relacionados

  • Cuenta Regresiva para FECHAS IMPORTANTES Voy a mostrar dos códigos diferentes que sirven para tener una cuenta regresiva en el blog. 1º Forma de Hacerlo: Este código Funciona para explorer y Firefox. Para tener nuestra […]
  • Instalar WordPress en nuestro Web Hosting Gratuito Manualmente Seguiremos explicando como instalar diferentes servicios o plataformas en el host 000Webhosting. Ya explicamos como subir archivos en uno de los ultimos post, . ¿Cual es la ventaja de […]
  • Como desplegar Codigo Esto es aplicable para cualquier plataforma de Blogs (Blogger, WordPress...) Como han visto en los post anteriores, siempre es útil desplegar los códigos para realizar cambios en la […]
  • ¿Cómo puedo escribir palabras en negrita o cursiva? Primero debes seleccionar la palabra que quieres resaltar (ya sea negrita o cursiva), para esto, pulsamos el boton izquierdo del mouse y lo mantenemos apretado mientras pasamos el […]
  • Blog visitas googlebot titulos_de_blog Ante todo desear a todos los lectores de este blog de ayuda y a Patricia un prospero año nuevo 2007 (aunque sea un poco tarde). Bueno, la sugerencia es la siguiente: como ahora si no […]
  • Videos Este Post es súper bueno, para los que quieren subir videos (esta sacado intacto de ñblog. En este blog, por lo que he visto siempre realizan comparaciones de los servicios u […]

Leave a Reply

Your email address will not be published. Required fields are marked *