es.hideout-lastation.com
Paraíso Para Los Diseñadores Y Desarrolladores


Flexdatalist - Complemento autocompletado con Apoyo

El HTML5 elemento es bastante útil en el desarrollo frontend moderno. Sin embargo, es uno de esos elementos que muchos desarrolladores no conocen.

Funciona en un campo de entrada donde puede autosugerir ciertos valores para la entrada . La configuración predeterminada se ve bien y hemos cubierto algunos consejos de codificación para crear efectos geniales con los datalists autosuggest.

Sin embargo, es mucho más fácil trabajar con un complemento como Flexdatalist . Es compatible con una amplia gama de navegadores y le permite personalizar completamente el diseño de su datalist .

No todos necesitan las funciones de autocompletar y con los datalists HTML5 nativos, es posible que no te molestes con un complemento. Sin embargo, Flexdatalist es quizás el mejor que existe porque se basa en comportamientos datalistas nativos para agregar:

  • Soporte de respuesta móvil
  • Descripciones adicionales para cada artículo
  • Opciones para múltiples selecciones a la vez
  • Gestores de eventos personalizados

Todo está impulsado por jQuery, por lo que necesitarás una copia de la última versión para que funcione. También viene con su propia hoja de estilos CSS que puede combinar en un único archivo CSS para reducir las solicitudes HTTP.

Puede encontrar instrucciones de configuración completas en la página de demostración principal que incluye enlaces de descarga a los archivos de Flexdatalist .

Es realmente simple de configurar, con solo una línea de JavaScript . De forma predeterminada, el complemento se dirige a todas las entradas con la clase .flexdatalist, por lo que simplemente agregar eso a su código debería ser suficiente para ver los resultados.

Usted acaba de agregar el elemento dentro de su campo de entrada y Flexdatalist maneja el resto. Automatizará la lista, incluido el texto descriptivo opcional.

La forma más sencilla de agregar texto adicional es a través de un archivo JSON que puede adjuntar a su entrada a través de un atributo de datos .

Por ejemplo, si visita la página de demostración de Flexdatalist, encontrará el campo de entrada "Países" con el atributo data-data='countries.json' . Esto hace referencia a un archivo remoto que almacena todos los datos de entrada sin procesar externamente .

Demasiados de estos campos puede ralentizar la página un poco . Sin embargo, no puedo imaginar que muchos sitios ejecuten más de unos pocos de estos formularios datalist en una sola página, sin mencionar que incluso con este plugin jQuery, todavía son bastante rápidos .

Para comenzar, solo visite el repositorio de GitHub y descargue una copia . Esto incluye un enlace a la página de demostración principal que también tiene documentación completa para la configuración, opciones de JavaScript y un montón de ejemplos de fragmentos de código para todos.

10 maneras en que Internet se Gamifica en la vida real (para bien o para mal)

10 maneras en que Internet se Gamifica en la vida real (para bien o para mal)

Desde los albores de los juegos modernos, nos hemos sentido un poco más atraídos por los mundos que imitan la vida en lugar de burlar sus reglas. Los juegos son más apasionantes cuando nos dan acceso a rincones del mundo real en los que de otra manera no nos podemos comprometer, o cuando nos dejan tomar decisiones que, de lo contrario, no son nuestras para hacer (como construir skylines y comunidades en SimCity ), o nos pondría en problemas si los hiciéramos (como montar en Grand Theft Auto).Es e

(Consejos de tecnología y diseño)

Hermosos fondos de pantalla de Ramadán para su escritorio

Hermosos fondos de pantalla de Ramadán para su escritorio

Ramadán es un mes de bendiciones y oraciones. En este mes, los musulmanes de todo el mundo ayunan durante el día. Todo tipo de comidas y bebidas están prohibidas desde el amanecer hasta el anochecer o durante el día. Es un mes de bondad que termina con uno de los mayores festivales en el calendario musulmán, el Eid-Ul-Fitr. El

(Consejos de tecnología y diseño)