Comment synchroniser une réplique extensible lors du défilement avec Divi

Section définit et modifie la couleur de fond. Couleur de fond: # 151515 Espacement ensuite, supprimez tous les remblais supérieurs et inférieurs par défaut. Remplissage supérieur: 0px remplissage inférieur: 0px Ajouter une structure de ligne 1 continuer à ajouter de nouvelles lignes en utilisant la structure de colonne suivante:
Redimensionner sans ajouter de module, ouvrir les paramètres de ligne et modifier les paramètres de taille comme suit: utiliser la largeur de gouttière personnalisée: Oui largeur de gouttière: 1 largeur: 90% largeur maximale: 1380 px Puis ajoutez un remplissage personnalisé en haut et en bas. Remplissage supérieur: 150 Px remplissage inférieur: 150 px Ajoutez le formulaire de texte 1 à la colonne ajouter du contenu, puis ajoutez le premier formulaire de texte qui contient du contenu de votre choix. Les paramètres de texte passent à l’onglet conception du formulaire et modifient les paramètres de texte en conséquence:
Police de texte: livvic poids de la police de texte: gras couleur du texte: # f1f1f1taille du texte: 170 pixels (bureau), 100 pixels (tablette), 70 pixels (téléphone) hauteur de la ligne de texte: 1EM Longueur horizontale de l’ombre de texte: 0,06 em longueur verticale de l’ombre de texte: 0em couleur de l’ombre de texte: rgba (79,79,79,0,74) Alignement du texte: Centre (bureau), gauche (tablette et téléphone) Cloner un formulaire texte deux fois cloner un formulaire texte deux fois. Modifier le contenu modifier le contenu de deux formulaires de texte en double. Ajouter une ligne # 2 Structure de colonne ajouter une autre ligne juste en dessous de la ligne précédente en utilisant la structure de colonne suivante: Redimensionner ouvre les paramètres de ligne et modifie les paramètres de taille en conséquence: utiliser la largeur personnalisée de la gouttière: Oui largeur de la gouttière: 1 largeur: 100% largeur maximale: 100% Espacement suivant, supprimer Imbo
A 3 Ouvrez les paramètres de la colonne 3 et supprimez le bord droit. Largeur du bord droit: 0px Modifier le contenu et modifier le contenu du module Blurb pour chaque copie. Ajouter un effet de défilement section redimensionner vers le haut et vers le bas il est temps d’ajouter un effet de défilement, en commençant par la section. Utilisez l’effet de défilement vers le haut et vers le bas de l’échelle pour les valeurs suivantes: activer le redimensionnement vers le haut et vers le bas: est l’échelle initiale: 70% moyenne: 100% finale: 100% Le formulaire de texte 1 s’efface, puis ouvre le premier formulaire de texte sur la première ligne de la section et ajoute un effet de fondu. Activer le fondu d’entrée et de sortie: est l’opacité initiale: 0% opacité moyenne: 0% (55%) opacité finale: 100% (71%) Redimensionner vers le haut et vers le bas il utilise également l’effet de redimensionnement vers le haut et vers le bas. Activer l’échelle supérieure et inférieure: est l’échelle initiale: 0% (47%) moyenne: 100% (56%) finale: 100% (64%) L’effet de défilement du module de texte étendu 1 se poursuit en étendant l’effet de défilement aux deux autres modules de texte de la colonne.
Total de tous les textes: cette colonne Module Blurb # 1 redimensionner vers le haut et vers le bas ensuite, nous ajouterons un effet de défilement de zoom vers le haut et vers le bas sur le module Blurb dans la colonne 1. Activer les zooms haut et bas: Oui zoom initial: Bureau: 0% tablette et téléphone: 100% zoom moyen: 100% (33%) zoom final: 100% (64%) Étendre l’effet de curseur # 1 du module Blurb complétez le tutoriel en étendant l’effet de curseur à tous les modules Blurb de la ligne et vous êtes prêt! Total de toutes les introductions: Cette ligne Aperçu maintenant que nous avons terminé toutes les étapes, regardons enfin les résultats sur les différents écrans de taille. Bureau Mobile Dans ce tutoriel, nous vous montrons une approche créative pour synchroniser les répliques extensibles dans la section Divi. Voilà.
C’est une bonne façon de mettre en évidence le texte et de permettre aux visiteurs de lire les différentes parties de la section étape par étape. Vous pouvez également télécharger gratuitement le fichier json! Si vous avez des questions ou des suggestions, n’hésitez pas à faire part de vos commentaires dans la section commentaires ci – dessous. Si vous souhaitez en savoir plus sur Divi et recevoir plus de cadeaux sur Divi, assurez – vous de vous abonner à notre newsletter et à YouTube Channel afin que vous soyez toujours l’un des premiers à apprendre et à bénéficier de ce contenu gratuit.