hideout-lastation.com
Paradis Pour Les Concepteurs Et Les Développeurs


Flexdatalist - Plugin de saisie semi-automatique avec Soutien

Le HTML5 élément est très utile dans le développement de frontend moderne. Pourtant, c'est l'un de ces éléments que peu de développeurs connaissent.

Il fonctionne sur un champ de saisie dans lequel vous pouvez effectuer un autosuggestion de certaines valeurs pour l'entrée . La configuration par défaut semble correcte et nous avons couvert quelques astuces de codage sur la création d'effets sympas avec des datalists autosuggest.

Cependant, il est beaucoup plus facile de travailler avec un plugin tel que Flexdatalist . Il prend en charge un plus large éventail de navigateurs et vous permet de personnaliser entièrement le design de votre datalist .

Tout le monde n'a pas besoin de fonctionnalités de saisie semi-automatique et avec les datalistes natifs HTML5, vous ne pouvez pas vous embêter avec un plugin. Cependant, Flexdatalist est peut-être le meilleur parce qu'il s'appuie sur les comportements natifs de la base de données pour ajouter:

  • Support réactif mobile
  • Descriptions supplémentaires pour chaque article
  • Options pour plusieurs sélections à la fois
  • Gestionnaires d'événements personnalisés

Tout est alimenté par jQuery, vous aurez donc besoin d'une copie de la dernière version pour que cela fonctionne. Il est également livré avec sa propre feuille de style CSS que vous pourriez vouloir combiner dans un seul fichier CSS pour réduire les requêtes HTTP.

Vous pouvez trouver des instructions d'installation complètes sur la page de démonstration principale qui comprend des liens de téléchargement vers les fichiers Flexdatalist .

C'est vraiment simple à configurer, avec une seule ligne de JavaScript . Par défaut, le plugin cible toutes les entrées avec la classe .flexdatalist, donc il suffit d'ajouter cela à votre code pour voir les résultats.

Vous venez d'ajouter le élément à l'intérieur de votre champ de saisie et Flexdatalist gère le reste. Il va auto-styler la liste, y compris le texte descriptif facultatif.

Le moyen le plus simple d'ajouter du texte supplémentaire est d' utiliser un fichier JSON que vous pouvez attacher à votre entrée via un attribut de données .

Par exemple, si vous consultez la page de démonstration Flexdatalist, vous trouverez un champ de saisie "Pays" avec l'attribut data-data='countries.json' . Cela fait référence à un fichier distant qui stocke toutes les données d'entrée brutes en externe .

Trop de ces champs vous pouvez ralentir un peu la page . Cependant, je ne peux pas imaginer que beaucoup de sites utiliseraient plus de quelques-uns de ces formulaires datalist sur une seule page, sans parler de ce plugin jQuery, ils sont encore assez rapides .

Pour commencer, visitez le dépôt GitHub et téléchargez une copie . Cela inclut un lien vers la page de démonstration principale, qui contient également une documentation complète sur l'installation, les options JavaScript et de nombreux exemples de code à suivre.

10 sites pour créer des GIF animés gratuitement

10 sites pour créer des GIF animés gratuitement

Quelle que soit votre humeur ou votre envie, quelque part dans le monde en ligne, il y a probablement un GIF pour montrer ce que vous ressentez vraiment. Mais que faire si vous ne trouvez pas ce GIF exact que vous voulez ? Pourquoi ne pas créer votre propre GIF animé personnalisé? Vous n'avez pas besoin d'être un expert pour le faire et aucune compétence technique n'est requise pour en créer un.Ici,

(Conseils techniques et de conception)

50 formulaires de connexion et d'inscription mobiles pour votre inspiration

50 formulaires de connexion et d'inscription mobiles pour votre inspiration

À l'instar des formulaires d'inscription à la newsletter, les applications mobiles sont aujourd'hui inondées de formulaires de connexion demandant la saisie de données à différentes étapes . Des achats en ligne et du commerce électronique aux jeux et divertissements, les données des utilisateurs ont tendance à être d'une grande importance pour les propriétaires d'applications. Cependant,

(Conseils techniques et de conception)