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


Détecter lorsqu'une souris quitte la fenêtre avec Glio.js

Combien de fois allez-vous fermer un onglet et remarquez une fenêtre modale vous demandant de rester ? Cela semble banal de nos jours et c'est fait pour une raison: ça marche!

Vous pouvez créer un effet similaire en utilisant la bibliothèque Glio.js. C'est un script JS open-source gratuit pour détecter quand le curseur de la souris de l'utilisateur est proche du bord ou quand il quitte la fenêtre du navigateur .

Cela peut être utilisé pour essayer de garder les visiteurs sur votre site . Mais, il peut également être utilisé pour créer des effets dynamiques si la souris de l'utilisateur va loin d'un côté de l'écran.

Vous trouverez beaucoup de ces scripts d'intention de sortie sur le Web et la plupart d'entre eux sont difficiles à personnaliser . Mais, c'est ce qui rend Glio.js si génial.

C'est une bibliothèque puissante qui vous permet de contrôler ce que vous faites avec l'écran. Si la souris de votre utilisateur quitte le navigateur, vous pouvez afficher un modal, ou changer la couleur d'arrière-plan, ou ne rien faire .

Il est également livré avec des points chauds intégrés que vous pouvez vérifier lorsque la souris de l'utilisateur se rapproche de l'un des quatre coins de l'écran. Vous pouvez également définir la méthode de rappel et la proximité du curseur avant d'exécuter quoi que ce soit.

Pour utiliser Glio, téléchargez simplement une copie de GitHub et installez-la. Vous pouvez également tirer une copie de Bower, npm, ou directement à partir d'un CDN .

Avec le script dans votre page, vous ajoutez simplement cette ligne de code (personnalisée avec vos options):

 glio.init ([direction, rappel]); 

L'option de direction peut être n'importe quel coin (par exemple "en haut à gauche") ou "en haut", représentant le haut de l'écran. Votre fonction de rappel est le code JS que vous voulez exécuter lorsque la souris de l'utilisateur est trop proche. Une autre option vous permet de définir la distance à partir du point de direction, vous pouvez trouver les informations connexes sur GitHub.

Donc, si vous cherchez un script simple pour détecter l'intention de sortie, Glio est une ressource incontournable.

Les secrets d'un blog de tueur Post [infographie]

Les secrets d'un blog de tueur Post [infographie]

L'un des aspects les plus difficiles de la gestion d'un blog est de se démarquer du paysage de blogs encombré, en plus de vidéos virales, de gifs, de nouvelles, de campagnes de marketing, etc., qui rivalisent tous pour la même attention. Qu'est-ce qu'un blogueur honnête à faire?Whois

(Conseils techniques et de conception)

Contrôle de l'animation CSS3 avec steps () Fonction

Contrôle de l'animation CSS3 avec steps () Fonction

L'animation est l'une des plus grandes fonctionnalités introduites dans CSS. Dans le passé, l'animation Web n'était disponible que sur le territoire JavaScript ou Flash. Mais, aujourd'hui, de nombreux sites choisissent d'utiliser CSS pour ajouter une animation subtile . Dans les articles précédents, nous avons vu comment faire des choses intéressantes avec l'animation CSS, comme ajouter un effet de sélection et ajouter un effet de rebond à quelque chose.Dans ce

(Conseils techniques et de conception)