Proyectos


Efecto de Marquesina Hacia Arriba En Javascript

Sabado, Septiembre 8th, 2007

Hace unos días debido al diferente comportamiento que tiene la etiqueta <marquee> en los navegadores al querer utilizarlo como Scroll (Behavior=”Scroll” Direction=”up”) me dispuse a buscar alguna librería que emulara ese comportamiento y encontré esta Prototype.js News Scroller que era justo lo que necesitaba, lamentablemente no estaba creado como una librería asi que basandome en esa y en esta hice una clase la cual quisiera compartir con ustedes.

Para utilizarla simplemente incluyen el script e instancian el objeto NewsScroller

  1. var scroll = new NewsScroller(‘marquesina’,10);

El primer parámetro es el ID del div que contiene el texto que queremos que actúe como marquesina y el segundo es la velocidad (predeterminado esta a 30).

Pueden ver un ejemplo de su utilización aquí.

[Descargar Scroll News]

Si duda algo sencillo pero que a veces da lata con eso de que cada navegador interpreta a su manera ciertas etiquetas.

Posts Relacionados:

Publicado en Desarrollo, General, Javascript, Javascripts, Personal, Programacion, Proyectos, Web | wong it! | 3 Comentarios »

Incluye tus Archivos JS y CSS Cuando los necesites

Viernes, Abril 13th, 2007

ACTUALIZACIÓN:

He modificado la libreria y la simplifique mucho mas pueden revisarla en esta dirección:

Include en Javascript

Bueno pues no se si a alguno de ustedes les ha surgido el problema de que su sistema esta demasiado cargado al inicio de archivos javascript y css que realmente solo lo utilizan ciertos módulos, pues a mi hace unos meses me surgió ese problema e investigando me puse a trabajar en una libreria que cargara los archivos Javascript mediante el DOM simplemente llamando a un método. La libreria fue basada en este artículo de Sentido Web y en este otro de phpied. El código es el siguiente:

  1. var ScriptLoader = {
  2. //Método a llamar para cargar el script
  3. loadScript: function(file,opt) {
  4.  
  5. if(typeof opt!=“object”) opt = {};
  6. if(opt.id==undefined) opt.id = “js_”+file;
  7.  
  8. id=opt.id;
  9. var head = document.getElementsByTagName(‘head’).item(0)
  10. var scriptTag = document.getElementById(id);
  11.  
  12. //Si no se quiere cache se genera un número aleatorio
  13. if(opt.cache==false){
  14. var milisegundos = new Date().getTime().toString();
  15. if(file.indexOf(“?”)!=-1) file = file+“&amp;”;
  16. else file = file+“?”;
  17.  
  18. file = file+milisegundos;
  19. }
  20.  
  21. if(scriptTag) return;
  22.  
  23. script = document.createElement(’script’);
  24. script.src = file;
  25. script.type = ‘text/javascript’;
  26. script.id = id;
  27. head.appendChild(script);
  28.  
  29. //Para IE
  30. script.onreadystatechange = function () {
  31. if (script.readyState == ‘complete’) {
  32. if(typeof opt.oncomplete == “function”) {
  33. opt.oncomplete();
  34. }
  35. }
  36. }
  37. //Para Firefox
  38. script.onload = function () {
  39. if(typeof opt.oncomplete == “function”) {
  40. opt.oncomplete();
  41. }
  42. }
  43.  
  44. return;
  45. },
  46. unloadScript: function(id){
  47. var head = document.getElementsByTagName(‘head’).item(0)
  48. var scriptTag = document.getElementById(id);
  49. if(scriptTag) head.removeChild(scriptTag);
  50. return;
  51. },
  52. loadCSS:function(file,opt){
  53. if(opt==null) opt = {};
  54. if(opt.id==undefined) opt.id = “css_”+file;
  55. id=opt.id;
  56.  
  57. var head = document.getElementsByTagName(‘head’).item(0)
  58. var scriptTag = document.getElementById(id);
  59.  
  60. if(scriptTag) return;
  61. //Si no se quiere cache se genera un número aleatorio
  62. if(opt.cache==false){
  63. var milisegundos = new Date().getTime().toString();
  64. if(file.indexOf(“?”)!=-1) file = file+“&amp;”;
  65. else file = file+“?”;
  66.  
  67. file = file+milisegundos;
  68. }
  69. css = document.createElement(‘link’);
  70. css.rel  = ’stylesheet’;
  71. css.href = file;
  72. css.type = ‘text/css’;
  73. css.id = id;
  74. head.appendChild(css)
  75. return;
  76. },
  77. unloadCSS:function(id){
  78. var head = document.getElementsByTagName(‘head’).item(0)
  79. var scriptTag = document.getElementById(id);
  80. if(scriptTag) head.removeChild(scriptTag);
  81. return;
  82. }
  83. }

(more…)

Publicado en Herramientas, Javascript, Librerias, Proyectos | wong it! | 15 Comentarios »



Tu banner aquí

Recibir Artículos Por Email

 
Envia tus notas!!!
Artículo Aleatorio
© 2008 WebAdictos - Una dosis diaria de web. CPP Powered by WordPress and Utom.
XHTML CSS   Creative Commons License