Déplacer des éléments HTML avec JQuery via Serial

Cette instructable agit en utilisant les valeurs reçues de l’Arduino et à les utiliser pour manipuler des éléments HTML à l’intérieur de Involt. Cependant cela n’utilisera pas les méthodes Involt JQuery ou éléments d’interface utilisateur, mais cet exemple est de montrer les possibilités du cadre de Involt et de son unique moyen d’y parvenir.

Quand j’ai appris le traitement, je me souviens les expériences, le codage créative et la création de jeux simples. Lors du développement d’Involt, en particulier son soutien JQuery j’ai décidé de tester chaque nouvelle méthode ou élément d’interface utilisateur avec simples manipulations DOM.

L’objectif de ce projet consiste à déplacer la position de l’élément html, tournez-le et placez les éléments basés sur notre position lorsque vous appuyez sur le bouton Arduino.

Même si la création de ce serait plus facile avec le traitement je pense que lorsque vous travaillez avec HTML/CSS/Jquery il y a beaucoup de possibilités qui peut être atteints plus facilement que d’autres solutions. Si vous êtes avancé en Javascript, vous pouvez combiner ce projet avec d’autres bibliothèques JS. Il est bon de savoir qu’il existe différentes méthodes pour la même chose et à mon avis, l’idée d’une interaction simple entre html et Arduino est plus qu’intéressante.

Si vous souhaitez lire plus d’infos sur Involt lire la page du projet.

Articles Liés

Créer un site Web tout sur vous avec Visual Studio (HTML, CSS, JQUERY)

Créer un site Web tout sur vous avec Visual Studio (HTML, CSS, JQUERY)

Hey tout le monde !Il s'agit de mon premier instructable et dans ce instructable je vais vous montrer comment utiliser Visual Studio pour créer votre propre site Web !Voici un lien de téléchargement pour Visual Studio :Liaison d'origine Visual Studio
Personnalisé des éléments avec des Lasers

Personnalisé des éléments avec des Lasers

Alors... certains de nos clients ont compris que notre coupeur de laser est génial à faire des cadeaux personnalisés, gadgets, et tel et nous voulons laisser le reste d'entre eux connaître les possibilités. C'est cette instructable va vous montrer co
Tormato !  Cage avec treillis de tomate et de système de livraison des éléments nutritifs

Tormato ! Cage avec treillis de tomate et de système de livraison des éléments nutritifs

The Tormato remplace les cages grillagées laid ou des piquets avec une cage esthétiquement agréable, treillis et un système de livraison nutritif !Plus d'info @ www.itsatormato.com.Étape 1: Outils de collecte Ligne de craieRuban à mesurerScie (main o
Peinture de Halloween avec le déplacement des yeux

Peinture de Halloween avec le déplacement des yeux

Parfait accessoire pour une fête d'Halloween spooky ou tout simplement pour faire peur à vos compagnons. Nous avons mis en place le Pi de framboise propulsé déplacement photo oeil qui peut être contrôlé de façon indépendante ou en utilisant la caméra
Comment parler avec des éléments

Comment parler avec des éléments

toujours envie de parler de quelque chose sans que personne de savoir ce que vous parlez, mais il se trouve être que compte-gouttes eaves, qui est toujours à votre écoute. Je déteste ça. Après beaucoup de réflexion, j'ai trouvé une solution. C'est pa
Faire votre propre kéfir avec des suppléments probiotiques

Faire votre propre kéfir avec des suppléments probiotiques

est-ce possible d'obtenir le produit laitier fermenté à l'aide de bactéries probiotiques?Si vous avez des suppléments probiotiques inutilisés, vous pouvez faire votre yogourt ou kéfir.Tout ce dont vous avez besoin est une demi bouteille de lait et qu
Croquis avec des éléments en fer et 3D imprimés connecteurs

Croquis avec des éléments en fer et 3D imprimés connecteurs

Un nouveau design d'intérieur de reprographie (espace de travail dédié aux publications d'artistes basées à Rotterdam au pochoir espace de présentation, boutique et risography) je cherchais un moyen de « sketch » avec des constructions de fer. J'ai a
Automatique d’arrosage des plantes en pot avec Intel Edison

Automatique d’arrosage des plantes en pot avec Intel Edison

Automatique d'arrosage des plantes en pot avec Intel Edison... Une sonde d'humidité détecte la faible teneur en humidité du sol et active la pompe à eau ou l'électrovanne qui contrôle le débit d'eau. Lorsque l'eau nécessaire est pompée vers les plant
À l’aide de Fusion pour faire des Sculptures en collaboration avec abeilles

À l’aide de Fusion pour faire des Sculptures en collaboration avec abeilles

Pour cette série de sculptures de collaboration, j'ai voulu faire un cadre organique, d'où mes abeilles pouvaient construire peigne. Peigne étant lourd lorsque rempli avec du miel et très fragiles lorsque tiré de la ruche, a décidé que je devais cons
De cliparts à objet - faire des images dans des choses réelles avec des Articles de base & outils !

De cliparts à objet - faire des images dans des choses réelles avec des Articles de base & outils !

Avez-vous jamais vu un morceau de clipart, ou peut-être fait un dessin de quelque chose que vous aimeriez transformer en un objet réel - peut-être à le pour usure, ou comme une œuvre d'art ? Avez-vous envie d'accrocher des Space invaders de vos cadea
Comment faire pour supprimer des étiquettes et autocollants (avec briquet)

Comment faire pour supprimer des étiquettes et autocollants (avec briquet)

je collectionne beaucoup de médias neuves/occasion tels que des livres et des DVD et les préfère sans étiquettes de prix ou déclarations "maintenant une importante Motion Picture". Beaucoup de gens ne se soucient les étiquettes sur le dos des li
Créer des Instruments électroniques interactifs avec MaxMSP

Créer des Instruments électroniques interactifs avec MaxMSP

Ce Instructable appartient à 3 dans une Intro de MaxMSP série je viens de terminer enseigner à Audio Mission des femmes à San Francisco. La partie 1 est une introduction à MaxMSP et MIDI, partie 2 est intermédiaire Max et Audio, et ce Instructable es
Gratuit des compléments de bacs de stockage de votre chat

Gratuit des compléments de bacs de stockage de votre chat

liste de matériel et d'équipement :Cruches de litière de chatCouteau utilitaireMarqueur SharpieRubanÉtape 1: Collecter la matière première... Sont de la matière première, je parle des cruches de litière de chat. Ils viennent dans une taille courte et
Des suppléments antioxydants puissants

Des suppléments antioxydants puissants

ces jours-ci, tout le monde semble avoir le cancer. Il y a trop de pollution, radiation, mauvaise nourriture et eau mal dans notre monde. Les antioxydants sont un moyen très puissant pour lutter contre ces dangers au sein de notre propre corps. Ces s