Etiqueta: js

Para aquellos que realizan frontend y se preguntan por qué un elemento no se muestra o por qué se descuadra, tal vez este tip les ayude mucho al momento de encontrar el problema. Con una línea de javascript pueden pintar los bordes de cada elemento del DOM.

DropzoneJS es una libreria opensource que permite subir archivos mediante la acción 'arrastrar y soltar' con la capacidad de mostrar vistas previas de las imágenes. Y django.. bueno, ya sabemos qué es django.

Jcanvas es un plugin para jquery que nos permite interactuar con el canvas de html5.

Entre sus características principales, resaltan:

• API Sencilla que permite el manejo de figuras geométricas, imágenes, máscaras, capas, animaciones..
• Funciona en navegadores móbiles y de escritorio (aunque no lo he probado en ningún móbil)
• Ligero (~25kB)
• OpenSource

Instalación

Se requiere añadir tanto jquery como el propio plugin:

    <script src="jquery.min.js"></script>
    <script src="jcanvas.min.js"></script>

Uso

Se pueden observar 3 ejemplos sencillos …

Fragmentos de código para limpiar o resetear formularios en JS. Note que "limpiar" borrará todo el contenido del formulario mientras que "resetear" restaurará los valores iniciales.

Reset form

Para resetear formularios existe un método de los forms:

::javascript
document.getElementById("test-form").reset();

Clear form

Para limpiar formularios en cambio, tenemos que escribir nuestra propia función, como por ejemplo¹:

::javascript
function clearForm(oForm) {

  var elements = oForm.elements;

  oForm.reset();

  for(i=0; i<elements.length; i++) {

    field_type = elements[i].type …

Mientras intentaba desarrollar un plugin para jquery tuve un inconveniente, el cómo hacer para obtener la posición relativa de un evento click hacia su contenedor.

Realizando algunas búsquedas en google y leyendo los diversos artículos pude obtener una idea del cómo estaba el panorama. Por ejemplo, revisando el tutorial de jquery que versa sobre el cálculo de la posición del mouse podemos destacar algunos puntos:

• pageX¹ y pageY son dos propiedades de todos los eventos javascript que nos indican …

Plugin para jquery que genera bloques flotantes que siguen al usuario cuando se desplaza la página. Utiliza posicionamiento absoluto para reajustar la posición en base a los estilos css iniciales.

Por ejemplo, se podría usar en los siguientes casos:

• Para realizar carritos de compras que muestran información de la compra actual
• En caso de querer añadir botones sociales (facebook, twitter..)
• Para generar menús flotantes

Requerimientos e Instalación

El plugin requiere tanto de jquery como de jquery easing.

Los scripts js …