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


Ajouter Drag & Drop au site Web facilement avec Dragula

Vous recherchez une bibliothèque gratuite pour gérer les fonctionnalités de glisser-déposer ? Ensuite, Dragula est la seule ressource dont vous aurez besoin.

Ce script gratuit vous permet d' ajouter des fonctionnalités de glisser-déposer pour n'importe quel élément de votre page . Cela inclut la prise en charge des frameworks React & AngularJS, ainsi que JavaScript JavaScript.

Dragula est super facile à configurer et il est livré avec un tas de déclencheurs personnalisés pour les comportements des utilisateurs . Cela signifie que vous pouvez déclencher vos propres fonctions après que l'utilisateur fait glisser un élément, clique sur un élément ou réorganise n'importe quelle partie de la page.

Si vous jetez un coup d'œil à la démo en direct, vous trouverez quelques extraits de code, ainsi que des exemples utilisables .

L'installation Dragula nécessite uniquement un seul fichier JavaScript pour le faire fonctionner. Bien que, les options supplémentaires peuvent être un peu déroutant.

Par exemple, disons que vous avez deux conteneurs, #left et #right, que vous voulez prendre en charge les éléments déplaçables. Vous devrez ajouter manuellement ces conteneurs à la fonction Dragula pour prendre en charge les méthodes de glisser-déposer.

Si vous n'avez pas une bonne compréhension des principes de base du développement frontal, vous aurez du mal à utiliser Dragula. Mais, le repo GitHub a beaucoup de bons exemples que vous pouvez suivre et même des extraits de code que vous pouvez copier .

Voici un exemple des documents GitHub pour savoir comment cibler les deux conteneurs (gauche et droit) :

 dragula ([document.querySelector ('# left'), document.querySelector ('# right')]); 

Notez que si vous regardez plus loin sur la page GitHub, vous trouverez une énorme liste d'options que vous pouvez passer à cette fonction.

Vous pouvez choisir de copier ou de déplacer des éléments, quel (s) conteneur (s) supporte (nt) les éléments déplacés et même les fonctions de rappel qui fonctionnent à travers différents comportements utilisateur tels que:

  • Planant au-dessus d'un conteneur
  • Premier clic et glisser l'événement
  • Déposer un événement
  • Déposer un élément hors des limites
  • Clonage d'un élément / conteneur en le faisant glisser

Cette bibliothèque prendra un peu de travail initial, mais si vous êtes familier avec JavaScript, cela devrait être une évidence.

Regardez sur la page de démonstration pour voir comment cela fonctionne et pour obtenir quelques idées d'exemples de code . Dragula est une bibliothèque massive et c'est probablement le meilleur script open-source pour gérer le glisser-déposer, avec la plus large gamme de personnalisation .

Introduction à MathML - Le langage de balisage pour les mathématiques

Introduction à MathML - Le langage de balisage pour les mathématiques

MathML est un langage de balisage qui peut être utilisé pour afficher des notations mathématiques . Vous pouvez utiliser des balises MathML directement à partir de HTML5. Il est utile lorsque vous souhaitez afficher plus que de simples notations de Maths dans vos pages Web, et qu'il est assez facile à utiliser en raison de sa simplicité et de sa ressemblance avec le HTML .MathM

(Conseils techniques et de conception)

30 dessins sur papier

30 dessins sur papier

Les concepteurs nous étonnent par leur talent et leur créativité lorsque nous voyons différents logos, pages de destination et bannières. Cependant, nous pouvons être doublement impressionnés lorsqu'ils se laissent aller à des formes d'art inhabituelles telles que le street art ou en jouant avec du papier, comme l'origami. Cepend

(Conseils techniques et de conception)