Comment masquer une partie de la page pendant un certain temps

Vous préparez votre page de vente VSL et vous souhaitez montrer uniquement la vidéo pendant quelques minutes ? Vous souhaitez masquer le bouton d'achat ou certains éléments de la page pendant un certain temps ? Dans cet article, nous allons présenter une solution simple.

C'est incroyable à quel point il est difficile de trouver quelque chose d'aussi simple sur Internet, peut-être à cause du manque d'expression du terme correct. Parfois, nous rencontrons des plugins ou des codes énormes pour accomplir quelque chose de très simple.

Ce que nous voulons ici, c'est masquer un élément CSS et ne l'afficher qu'après un certain temps. Cela peut facilement être créé avec un simple Javascript de moins de 4 lignes.

Comment masquer un élément pendant quelques minutes ?

La première chose que vous devez comprendre est quel élément vous allez cacher. Si vous souhaitez masquer presque toute la page, ne laissant que la vidéo, créez simplement un DIV avec HTML, mettez une classe CSS de votre choix et fermez-la en bas de la page.

.classname {display:none;}

Si vous utilisez l'éditeur de blocs WordPress, vous pouvez également masquer facilement des éléments en accédant aux paramètres avancés de chaque bloc et en définissant la classe CSS.

Après avoir choisi la classe CSS et l'avoir ajoutée aux éléments que vous souhaitez masquer, vous devez ajouter le Javascript dans l'en-tête. Tout dépend du thème ou du plugin que vous utilisez.

Ajoutez le code suivant dans l'en-tête :

<script>setTimeout(function() {
  $('.classname').show()
}, 400000);
</script>

Dans ClassName, vous mettez le nom de la classe que vous souhaitez masquer. Dans le nombre 400000, vous déterminez le temps d'attente pour que l'élément devienne visible. Il s'agit de millisecondes.

Tous les 1000, nous avons un total de 1 seconde. Ainsi, les 400 000 trouvés dans le code équivaut à environ 6 minutes. Vous pouvez utiliser ces informations pour calculer le temps souhaité.

Vous voyez à quel point il est simple de masquer un élément ou la moitié de la page pendant un certain temps ? Un code simple, parfait pour créer votre VSL, votre page de vente ou toute autre chose sur laquelle vous souhaitez vous concentrer.