Active l’effet de curseur de la souris sur les modules, les colonnes et les lignes en même temps

L’un des avantages de la création de sites avec Divi est que chaque bloc de construction a des options de conception. Chaque module, colonne, ligne et section contient les paramètres de conception de l’état par défaut et de l’état du curseur de la souris. Cela ouvre la porte à l’activation de plusieurs effets lorsque vous passez le curseur tout en combinant ces éléments. Dans ce tutoriel, je vais vous montrer comment activer les effets en même temps que vous passez le curseur sur les modules, les colonnes et les lignes. L’astuce est de s’assurer que tous les éléments partagent la même taille et l’espace que la souris. Mais une fois que vous avez les bons éléments, vos effets et votre design deviennent très créatifs lorsque vous passez le curseur.
On y va. Voici un exemple rapide de la façon d’activer les effets des différents éléments Divi pendant que vous passez le curseur. Pour maîtriser la conception de ce tutoriel, vous devez d’abord le télécharger en utilisant les boutons ci – dessous. Pour accéder au téléchargement, vous devez vous abonner à notre liste de diffusion quotidienne Divi en utilisant le tableau ci – dessous. En tant que nouvel utilisateur, vous recevrez plus de Divi Goods et un paquet gratuit Divi Layout le lundi! Si vous êtes déjà sur la liste, il vous suffit de saisir votre adresse e – mail ci – dessous et cliquez sur télécharger. Vous ne serez pas « ré – abonné » ou vous recevrez un courriel supplémentaire.
Télécharger le fichier Inscrivez – vous à Divi Newsletter et nous vous enverrons par courriel une copie du dernier paquet de mise en page de la page d’atterrissage Divi, ainsi qu’un grand nombre d’autres ressources, conseils et astuces Divi gratuits. Suivez – nous et vous serez bientôt maître Divi. Si vous êtes déjà abonné, entrez votre adresse e – mail ci – dessous et cliquez sur télécharger pour accéder au paquet Layout. Vous vous êtes inscrit avec succès. Vérifiez votre adresse e – mail pour confirmer votre abonnement et accédez à P
Partagez la dégustation de la souris. Un exemple de combinaison d’effets lorsque vous passez le curseur de la souris Voici un exemple de la façon d’utiliser Divi. Dans l’exemple suivant, nous avons une ligne avec une image de fond. Au fur et à mesure que la souris passe, nous voyons l’ombre retardée de la boîte, qui ressemble à un élément de conception de bord. À l’intérieur de la ligne, une colonne est remplie d’une ombre noire. Lorsque vous passez le curseur, l’ombre du panneau de colonne diminue progressivement pour afficher l’image de fond de la ligne. Dans la colonne, nous avons un module Blurb sur fond bleu. Lorsque vous déplacez la souris, l’arrière – Plan bleu change en bleu translucide afin que vous puissiez voir l’image de l’arrière – plan. Parce qu’il y a de l’espace entre chaque élément, vous pouvez voir un effet de vol stationnaire spécifique pour chaque élément lorsque vous passez le curseur sur chaque espace de vol stationnaire individuel. Cependant, si nous supprimons l’espacement et spécifions une largeur personnalisée pour la ligne, tous les éléments partagent le même espace lorsque vous passez le curseur. En d’autres termes, le module occupe tout l’espace des colonnes et des lignes. Ensuite, lorsque vous passez le curseur sur un module, l’effet est activé lorsque vous passez le curseur sur le module, la colonne et la ligne. Le délai de conversion est très efficace dans cette configuration. Rappelez – vous que dans l’exemple ci – dessus, il y a un délai de conversion sur l’effet de la souris de ligne et de colonne, ce qui souligne vraiment la fonctionnalité de ce concept. Si nous essayons d’ajouter une combinaison similaire d’effets de vol stationnaire de souris seulement dans le module, nous ne pouvons pas bénéficier de l’application de différents délais de transition et durées pour chaque effet de vol stationnaire de souris. Recréer l’exemple de conception dans Divi pour vous montrer comment cela se passe dans le monde réel de Divi, Recréez l’exemple décrit ci – dessus.
– Oui. Les exemples présentés dans cet article se concentrent sur certaines des nombreuses combinaisons d’effets de vol de la souris qui peuvent se produire lorsque vous combinez des modules, des colonnes et des lignes avec l’état de vol de la souris. De plus, nous n’avons même pas exploré la possibilité de combiner les options de saut de souris de partition qui vous donneront plus d’options de saut de souris. Voici quelques conseils et idées pour vous aider à explorer ces effets tout seul. Utilisez l’ombre de la boîte au lieu de la bordure: la bordure ajoute en fait de l’espace supplémentaire au projet, de sorte qu’elle peut causer des dégagements inutiles pendant le vol stationnaire. Les ombres de boîte ajoutent un élément de conception qui n’ajoute pas d’espace réel. Explorez les effets lors de la conversion de la souris de fond: chaque élément Divi a des options de conversion de la souris de fond que vous pouvez combiner pour des couches d’effet créatives lors de la conversion de la souris. Utilisez les options de transformation de la souris: les options de transformation de la souris ajoutent des éléments créatifs tels que le redimensionnement et la rotation des éléments comme transformations de la souris. Cependant, lorsque vous passez le curseur, il peut être difficile de faire tourner plusieurs éléments, car cela peut entraîner un saut. Utilisez l’option transition: lorsque vous passez au – dessus de chaque élément, vous pouvez créer une animation de souris unique en ajoutant différentes durées et retards de transition à l’état. J’espère que ce tutoriel vous inspirera à explorer quelques combinaisons étonnantes d’effets de vol stationnaire de souris dans Divi. J’ai hâte d’entendre vos commentaires. Bonjour!