Archive for the 'javascript' Category

15JulAcentos en alerts y confirm con javascript

Cuando sacamos mensajes en el navegador usando javascript, nos encontramos con que los acentos y símbolos no usuales en la cultura anglosajona dan problemas. Problemas como esta visualización de un mensaje:

El modo de solucionar esta forma de mostrar los acentos,  es usar las codificaciones correspondientes en unicode.

\u00e1 -> á
\u00e9 -> é
\u00ed -> í
\u00f3 -> ó
\u00fa -> ú
\u00c1 -> Á
\u00c9 -> É
\u00cd -> Í
\u00d3 -> Ó
\u00da -> Ú
\u00f1 -> ñ
\u00d1 ->Ñ

Sencillo pero tremendamente útil.

 

06AbrCrear menús desplegables con CSS

css_menus

Los menús desplegables son un recurso habitual en la web. Permiten disponer la información en varios niveles que no sean siempre visibles y eso facilita tremendamente la arquitectura de la información en la web. Por espacio, por claridad, por dosificación de la información… Los encontramos en muchísimas páginas pero generarlos no es tan sencillo como pueda parecer. Hoy voy a dejar dos recursos y una solución a un problema concreto. Los recursos son dos ejemplos de Menús desplegables para poder insertar en cualquier página. La solución se refiere a un problema concreto. ¿Cómo hacemos que una "div" de uno de estos menús se sitúe sobre un objeto flash? O dicho de otra forma ¿Qué pasa cuando el menú desplegable se ha de situar sobre un SWF?

Antes de la explicación he de decir que los menús desplegables tradicionalmente se hacían mediante Javascript. Esto tiene varios problemas. El primero es que dependes de que el navegador del usuario tenga habilitado el Javascript. Si no lo tiene no ve los menús. El segundo es que si tienes a solventar los problemas empleando Javascript puedes acabar sobrecargando la web. Entre las ventajas estaría la dinamicidad de los menús y las posibilidades, mucho mayores empleando Javascript. Yo me decanto en este post por presentaros los menús hechos mediante CSS.

Bien, el recurso que os propongo es una web de las que podéis descargar menús que podréis utilizar sin problemas.

CSS Menus es una web con diferentes menús desplegables. Son gratuitos aunque el autor ha habilitado un espacio para donar dinero al proyecto.
http://www.cssmenus.co.uk/

25NovCódigos diferentes para navegadores diferentes

A lo mejor un día tenéis que trabajar con diferentes códigos para diferentes navegadores. En mi caso ha sido debido a los archivos o2c. Los archivos o2c son archivos en 3d que pueden ser reproducidos por el Navegador (con el correspondiente player) y permiten navegar en el archivo 3d así como modificar algunos parámetros como el color de fondo, la posibilidad de girar los elementos de forma automática etc…

No los he generado nunca pero el cliente me los proporcionaba para integrarlos en su web. Lo que os adjunto es un código en Javascript muy sencillito que me ha permitido detectar el navegador mediante el atributo "appName" del objeto "navigator" y de esto modo proporcionar un código diferente a cada Navegador. Uno para Firefox y otro para Explorer. No podía usar el mismo código debido a que no soportan los mismo atributos para la etiqueta object. En cualquier caso no me interesaba demasiado investigar sobre el o2c, dado que es un player muy poco extendido, y sí solucionar el problema.

  1.  
  2. <script lang="javascript">
  3. if(navigator.appName=="Microsoft Internet Explorer"){
  4.    document.write(‘<OBJECT CLASSID="CLSID:B1953AD6-C50E-11d3-B020-00A0C9251384" CODEBASE="http://www.o2c.de/download/o2cplayer.cab#version=2,0,0,37" TITLE="Wenn Sie hier kein 3D Objekt sehen, surfen Sie zu www.o2c.de und installieren Sie den O2C-Player!"ID=o2c height="100%" width="100%" ><param name="BackColor" value="16777215"><param name="Phi" value="115"><param name="Psi" value="10"><param name="KeepSpinning" value="-1"><param name="SpinPhi" value="20"><PARAM NAME=Lights VALUE=15><PARAM NAME=ObjectURL VALUE="index.o2c"></OBJECT>’);
  5.    }else{
  6.  document.write(‘<OBJECT DATA="index.e3d" TYPE="application/x-o2c-object" WIDTH=100% HEIGHT=100% ID="O2cFF" VIEWASTEXT> <PARAM NAME="Appearance" VALUE="1"><PARAM NAME="BackColor" VALUE="#886600"><PARAM NAME=Zoom VALUE="1"><PARAM NAME=BackStyle VALUE="0"><PARAM NAME="BackColor" VALUE="#886600"><PARAM NAME=ObjectURL VALUE="index.o2c"></OBJECT>’);
  7. }
  8. </script>
  9.  
  10.  

14SepEyeOS, escritorio virtual


El último post que escribí lo acabé con esta idea: "Sobre la mente de algunos planea ya la idea de un sistema operativo online…pero por el momento son sólo ideas….". Me refería sobre todo a ese rumor que planea en la red de que google no tardará en sacar un nuevo sistema operativo. Hoy os dejo lo más parecido a un sistema operativo online que he encontrado. El EyeOS.

Como curiosidad os diré que el proyecto lo iniciaron en agosto del 2005  un pequeño grupo de jóvenes programadores originarios de Barcelona, que permite trabajar totalmente en línea, que no tiene dependencias (salvo las básicas de un navegador) y que tiene un fuerte sistema de seguridad. Además se ofrece libremente para que cualquiera pueda instalarlo y utilizarlo en sus servidores e intranets con Windows.

Señalar desde el punto de vista técnico lo sorprendente que resulta que una herramienta tan potente (hablo del aspecto gráfico) esté hecha con HTML, PHP, AJAX y JavaScript. Matar moscas a cañonazos debe ser una tarea equiparable….

Disfrutadla!

02MarCheat Sheets

Las "cheat sheets" resultan bastante cómodas cuando uno trabaja habitualmente con un lenguaje o varios y tiene que tener en mente muchas de las funciones, parámetros, variables y demás términos que varían de un lenguaje a otro y resulta complejo tener presente. Aclarando el término las "cheat sheet" vienen a ser algo así como chuletas. De hecho creo que esa es la traducción del término en inglés.

Estas hojas que suelen estar habitualmente en forma tablas, bien como imágenes o bien como pdf son un recordatorio de lo terminología más usada de cada teconología o lenguaje web. En la página ilovejackdaniels.com tenéis cheat sheets para actionscript, php, javascript, mysql, css, xhtml….y otras tecnologías. Es tan sencillo como bajárselas e imprimirlas. En este enlace podéis encontrar también cheat sheets para Ajax:

27FebParser de código para wordpress

Un analizador sintáctico (parser, en inglés) en informática y linguística es un proceso que analiza secuencias de tokens para determinar su estructura gramatical respecto a una gramática formal dada.

Para que nos entendamos, gráficamente un parser es una herramienta que se utiliza para colorear y justificar el código de forma que presente un aspecto más legible y permita entenderlo con mayor rapidez y por lo tanto detectar fallos con mayor velocidad.

Lo primero que me planteé al empezar este blog fue que todas las entradas que hiciera con código tuviesen esa facilidad visual. Este es el proceso que seguí para conseguir que wordpress me mostrara el texto parseado, como se ve aquí

  1. $valor=5;  for(i=0;i<20;i++){  if(i!=4) i++;  }

Continue reading ‘Parser de código para wordpress’




 

Mayo 2012
L M X J V S D
« May    
 123456
78910111213
14151617181920
21222324252627
28293031