11521 sujets

JavaScript, DOM et API Web HTML5

Bonjour à tous et toutes!

J'ai une modale bootstrap qui s'affiche au chargement de la page d'accueil grâce à ce code :

$(document).ready(function() {
	$("#modal-id").modal('show');
});

Je souhaite que cette modale n'apparaisse qu'une seule fois par session. Je crois savoir qu'on peut utiliser la méthode SessionStorage. Mais en terme de code, sur ce coup je suis un peu une buse! Quelqu'un pourrait m'aider svp?
Voici ce que je fais pour une div#terms-use comportant un message d'avertissement de la CNIL (en localStorage, mais il suffit d'adapter) :

function termsUse() {
	var el = document.getElementById( 'terms-use' );
	if ( el ) {
		var cmd = el.querySelectorAll( 'button' )[0];
		el.style.display = 'block'; // @note Par défaut l'élément est caché afin d'éviter un visuel désagréable au chargement de la page
		cmd.onclick = function(){
			localStorage.setItem( 'termsuse', 'true' );
			el.style.display = 'none';
		};
		if (localStorage.getItem( 'termsuse' ) === 'true' ) {
			el.style.display = 'none';
		}
		//localStorage.removeItem( 'termsuse' ); // Réinitialisation de la valeur pour les tests, la clef peut aussi s'effacer directement via l'outil d'inspection
	}
}
termsUse();

Ici il faut cliquer sur un bouton pour fermer la fenêtre

Exemple sur l'un de mes sites
Modifié par Olivier C (01 Dec 2018 - 11:56)
Merci Zelena et Nicolas!
je me permets d'insister sur mon coté "buse en code"... Je comprends les grandes lignes du web storage, la théorie, mais par contre dans le concret, je ne sais pas!! Arf le code... je ne vois pas comment faire disparaître cette modale le temps d'une session!
merci encore pour votre aide!
Bonsoir.

La 'variable session' n'existe que le temps de la session...

Si la variable existe, c'est qu'elle a été créée au début de la session. On n'affiche donc pas la fenêtre modale.

Si elle n'existe pas, on affiche la fenêtre modale et on crée la 'variable session.

Avant d'afficher la fenêtre modale, on vérifie donc l'existence de la 'variable session'.

Est-ce plus clair ?

Smiley smile
Bonjour,

C'est parfait Zelena, j'ai tout compris! (j'ai eu tout de même un coup de main pour ma syntaxe). et ça y est ça marche! c'est magique!
Merci encore