Similar Posts
Menú contextual mediante Javascript
LiberÃa Javascript para crear un menú contextual cuando se pincha con el botón derecho del ratón, centrado en el contenido en el que se pulsa.
Entre las opciones que ofrece está:
- Opciones del menú que enlazan a cualquier sitio.
- Opciones del menú que realizan cualquier función de Javascript.
- Opciones del menú que muestran texto estatico.
- Opciones del menú que recuperan texto vÃa una llamada Ajax.
- Separadores de opciones en el menú.
- Iconos para las opciones del menú.
- Diferentes menús que son llamados dependiendo del elemento que se pulsa.
- Todos los elementos del menú tienen etiquetas que son transformadas en tiempo de ejecución por los valores introducidos en el elemento pulsado.
- Evaluación condicional de las opciones del menú, una opción se puede mostrar o no dependiendo de una condición en la plantilla del menú.
- Estilos CSS.
- Javascript no obtrusivo.
VÃa / Ajaxian
Laboratorio: realizar drag and drop de elementos HTML
Dentro de la Web 2.0 se intentan hacer cosas menos web y más tipo aplicación de escritorio. Una de estas cosas es realizar un drag and drop. Esto nos puede ser útil para interactuar con elementos, por ejemplo, tenemos una lista de productos, pinchamos en uno y arrastramos en otro, obteniendo una comparativa de los productos. Bueno, las aplicaciones que le podemos dar depende de nuestras necesidades y de nuestra imaginación. Eso sÃ, la forma de realizarlo es la misma.
En el ejemplo que hemos creado, hacemos que el elemento seleccionado se posicione encima del elemento sobre el que realizamos el drop. También hay que tener en cuenta, que en este caso, el drag&drop que hacemos es pinchando-moviendo-pinchando, no pinchando-moviendo-soltando. Realmente también se podrÃa hacer asÃ, pero como lo hemos hecho válido para texto, si lo hacemos de la manera normal, se podrÃa ir seleccionando el texto según se mueve el ratón.
Read More “Laboratorio: realizar drag and drop de elementos HTML”
NitobiBug: debug para Javascript
NitobiBug es un script similar a Firebug que nos permite realizar debugs en nuestros scripts. Permite mostrar una ventana emergente con el contenido de objetos (diferenciando entre tipos), elementos DOM o simplemente mensajes.
Usarlo es tan sencillo como esto:
var myObject = {a:234523, something:'else', mylist:[32423,4556,'sdfs']}; nitobi.Debug.log(myObject);
Y para instalarlo solo hay que añadir el archivo js.
Una alternativa a Firebug, sobre todo para IE, pero me sigo quedando con Firebug.
jQuery Masonry: encaja capas HTML
Supongo que lo de “encajar capas HTML” no es algo que se entienda muy bien, pero realmente se trata de eso. Este plugin de jQuery coloca las capas HTHL de tal forma que no queden espacios en blanco entre ellas (algo normal cuando se usa el css float).
Hay que tener cuidado, porque aunque nos devuelve un layout sin espacios en blanco, también nos lo da con un orden no muy usable, por lo que es importante no usar este plugin cuando el orden de colocación importa.
jQuery Masonry
Vía / WebAppers
Cargar contenido con el scroll mediante jQuery
Interesante script que carga el contenido en una capa según se va utilizando el scroll y se va llegando al final, algo similar a lo que ocurre en Google Reader.
El autor nos explica paso a paso, incluida la parte PHP, cómo realizar esta funcionalidad.
Load Data while Scrolling Page Down with jQuery and PHP
Vía / DZone
$fx(): librería javascript para animaciones
$fx() es una librería que nos permite realizar animaciones de elementos HTML de forma sencilla. Altera las propiedades CSS a lo largo del tiempo pasando solo una pequeña configuración. Además se pueden combinar efectos, grupos de ellos, encadenarlos o ejecutarlos en paralelo, incluso indicar diferentes callbacks para dar una mayor flexibilidad.
Para aquellos que necesiten tan solo hacer animaciones y no quieran cargar todo el core de jQuery o Mootools, les puede venir muy bien.
$fx()
Vía / Script & Style