Afficher une div une fois par jour

**stanux24** · 29/11/2011, 11h49

Bonjour,

J'ai un problème avec de script, je n'ai pas de bonne connaissance en javascript et du coup j'ai du mal. Ce que j’aimerai réaliser c'est afficher une div une fois par jour et par visiteur, voici ce que j'ai fait:

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
<script type="text/javascript" language="JavaScript">
 
  function setCookie(nom, valeur, expire, chemin, domaine, securite){
 
     document.cookie = nom + ' = ' + escape(valeur) + '  ' +
 
               ((expire == undefined) ? '' : ('; expires = ' + expire.toGMTString())) +
 
               ((chemin == undefined) ? '' : ('; path = ' + chemin)) +
 
               ((domaine == undefined) ? '' : ('; domain = ' + domaine)) +
 
               ((securite == true) ? '; secure' : '');
 
   }
 
 
 
   var dtExpire = new Date();
 
   dtExpire.setTime(dtExpire.getTime() + 3600 * 1000);
 
 
 
   setCookie('coucou', 'hey hey', dtExpire, '/' );
 
 
 
  
 
   function  getCookie(name){
 
     if(document.cookie.length == 0)
 
       return null;
 
 
 
     var regSepCookie = new RegExp('(; )', 'g');
 
     var cookies = document.cookie.split(regSepCookie);
 
 
 
     for(var i = 0; i < cookies.length; i++){
 
       var regInfo = new RegExp('=', 'g');
 
       var infos = cookies.split(regInfo);
 
       if(infos[0] == name){
 
         return unescape(infos[1]);
 
       }
 
     }
 
     return null;
 
   }
 
   </script>
 
 
 
 
 
 
 
 
 
   <script type="text/javascript">
 
window.onload=function()
 
{
 
    var coucou = document.getElementById('coucou');
 
    
 
 if  (document.cookie) { coucou.style.display="none";    }
 
  else {    coucou.style.display="inline";
 
            
 
}
 
  } 
 
</script>  
 
 
 
<script language="JavaScript" type="text/javascript" src="../js/div.js"></script>
 
 
 
<div ID="coucou">
 
 
 
<div id="fermer" style="display">
 
<div class="test">
 
<div class="test1">
 
<div class="test2">
 
<a  title="fermer"  href="javascript:visibilite('fermer');"><img src="../images/cancel.png" alt="Fermer" width="32" height="32"/></a>
 
</div>
 
<object > </object>
 
</div>
 
</div>
 
</div>
 
</div>

A priori j'ai un bug dans l'ordre d'exécution puisque ma div n’apparaît jamais j'ai essayé plein de combinaison pour inverser l'ordre mais je dois mal m'y prendre. Naturellement a chaque test je prend bien soin de supprimer tout mes cookies. Si quelqu'un pouvait me dire précisément ou ça bloque... ne soyez pas trop dur avec moi je n'ai vraiment que très peut de connaissance, j'ai récupérer plusieurs script depuis plusieurs tuto que j'ai assemblé.

Merci par avance

**NoSmoking** · 29/11/2011, 13h09

Bonjour,
sans regarder plus avant, j'aurais plutôt fait un

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
if( getCookie('coucou')){
  coucou.style.display = 'none';
}

**stanux24** · 29/11/2011, 13h28

Bonjour,

Merci pour cette réponse, j'a modifié mon code donc maintenant ma div s'affiche tous le temps elle ne tiens pas compte du cookie on dirai.

**NoSmoking** · 29/11/2011, 14h24

il est normal que tu ai toujours la même chose attendu que quoiqu'il arrive tu écris le cookie, c'est dans ton code

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
   var dtExpire = new Date();
   dtExpire.setTime(dtExpire.getTime() + 3600 * 1000);
   setCookie('coucou', 'hey hey', dtExpire, '/' );

il te faut vérifier si existe et si non existant tu le crées

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
if( getCookie('coucou')){
  coucou.style.display = 'none';
}
else{
  var dtExpire = new Date();
  dtExpire.setTime(dtExpire.getTime() + 3600 * 1000);
  setCookie('coucou', 'hey hey', dtExpire, '/' );
}

un truc dans ce style...

**stanux24** · 29/11/2011, 14h46

je vois ce que tu veux dire, j'ai essayé ma div apparaît toujours

je remet le code utiliser actuellement:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
<script type="text/javascript" language="JavaScript">
 
  function setCookie(nom, valeur, expire, chemin, domaine, securite){
 
     document.cookie = nom + ' = ' + escape(valeur) + '  ' +
 
               ((expire == undefined) ? '' : ('; expires = ' + expire.toGMTString())) +
 
               ((chemin == undefined) ? '' : ('; path = ' + chemin)) +
 
               ((domaine == undefined) ? '' : ('; domain = ' + domaine)) +
 
               ((securite == true) ? '; secure' : '');
 
   }
 
 
 
 
   function  getCookie(name){
 
     if(document.cookie.length == 0)
 
       return null;
 
 
 
     var regSepCookie = new RegExp('(; )', 'g');
 
     var cookies = document.cookie.split(regSepCookie);
 
 
 
     for(var i = 0; i < cookies.length; i++){
 
       var regInfo = new RegExp('=', 'g');
 
       var infos = cookies.split(regInfo);
 
       if(infos[0] == name){
 
         return unescape(infos[1]);
 
       }
 
     }
 
     return null;
 
   }
 
   </script>
 
 
 
 
 
 
 
 
 
   <script type="text/javascript">
 
window.onload=function()
 
{
 
    var coucou = document.getElementById('coucou');
 
 
 
if( getCookie('coucou')){
  coucou.style.display = 'none';
}
else{
  var dtExpire = new Date();
  dtExpire.setTime(dtExpire.getTime() + 3600 * 1000);
  setCookie('coucou', 'hey hey', dtExpire, '/' );
}
 
  } 
 
</script>
 
 
 
 
<script language="JavaScript" type="text/javascript" src="../js/div.js"></script>
 
 
 
<div ID="coucou">
 
 
 
<div id="fermer" style="display">
 
<div class="test">
 
<div class="test1">
 
<div class="test2">
 
<a  title="fermer"  href="javascript:visibilite('fermer');"><img src="../images/cancel.png" alt="Fermer" width="32" height="32"/></a>
 
</div>
 
<object > </object>
 
</div>
 
</div>
 
</div>
 
</div>

**NoSmoking** · 29/11/2011, 14h53

je pensais que tu avais recopier les fonctions getCookie et setCookie mais il y a une erreur dans getCookie

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var infos = cookies[i].split(regInfo);

et non

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var infos = cookies.split(regInfo);

http://javascript.developpez.com/faq...=navig#cookies

**stanux24** · 29/11/2011, 15h02

Super ! alors là un grand merci , j'aurai pu chercher un moment je n'aurai pas trouvé comme ça aussi rapidement

j'ai juste une question pour finir, c'est peut etre du a la methode ou peut etre simplement l'ordre d'affichage, voila ce qui se passe:

1 on arrive sur la page parfait la div s'ouvre comme prévu

2 on va sur une autre page la div s'ouvre une fraction de seconde puis se ferme

Est ce que l'on peut éviter cela a votre avis? le fait qu'elle s'ouvre une fraction de seconde ?

merci encore

**Bovino** · 29/11/2011, 15h13

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
var regSepCookie = new RegExp('(; )', 'g');
var cookies = document.cookie.split(regSepCookie);

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var cookies = document.cookie.split('; ');

te semble trop simple ?

la div s'ouvre une fraction de seconde puis se ferme

C'est normal, la div restera affichée tant que le code n'aura pas été interprété, c'est-à-dire au onload de la page, lorsque tous les éléments auront été récupérés (y compris les images et autres éléments remplacés).
Pour parer à cela, tu peux masquer la div par défaut et ne l'afficher que si besoin.

**stanux24** · 29/11/2011, 15h47

ah ok je comprend mieux bon j'ai trouvé

par contre avant d'afficher mon code final pour que d'autre personne dans la galere puisse le reutiliser je n'ai pas compris ce que tu as voulu me dire par :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
var regSepCookie = new RegExp('(; )', 'g');
var cookies = document.cookie.split(regSepCookie);

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
var cookies = document.cookie.split('; ');
 
te semble trop simple ?

Il faut que je remplace

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var cookies = document.cookie.split(regSepCookie);

par

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var cookies = document.cookie.split('; ');

si oui pourquoi? je suis désolé de mon incompétence

sinon mise a par ça ça fonctionne parfaitement et grâce a toi !

[EDIT] ça ne marche que sur IE arf c'est domage on y est presque

je met le code

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
<script type="text/javascript" language="JavaScript"> 
  function setCookie(nom, valeur, expire, chemin, domaine, securite){ 
     document.cookie = nom + ' = ' + escape(valeur) + '  ' + 
               ((expire == undefined) ? '' : ('; expires = ' + expire.toGMTString())) + 
               ((chemin == undefined) ? '' : ('; path = ' + chemin)) + 
               ((domaine == undefined) ? '' : ('; domain = ' + domaine)) + 
               ((securite == true) ? '; secure' : ''); 
   } 
 
   function  getCookie(name){ 
     if(document.cookie.length == 0) 
       return null;
 
     var regSepCookie = new RegExp('(; )', 'g'); 
     var cookies = document.cookie.split('; '); 
 
     for(var i = 0; i < cookies.length; i++){ 
       var regInfo = new RegExp('=', 'g'); 
       var infos = cookies[i].split(regInfo); 
       if(infos[0] == name){ 
         return unescape(infos[1]); 
       } 
     } 
     return null; 
   } 
   </script>
 
   <script type="text/javascript"> 
window.onload=function() 
{ 
    var coucou = document.getElementById('coucou'); 
if( getCookie('coucou')){
  coucou.style.display = 'none';
}
else
 
 
{
fermer.style.display = 'inline';	
  var dtExpire = new Date();
  dtExpire.setTime(dtExpire.getTime() + 3600 * 1000);
  setCookie('coucou', 'hey hey', dtExpire, '/' );
} 
  }  
</script>  
 
<script language="JavaScript" type="text/javascript" src="../js/div.js"></script>
 
<div ID="coucou">
<div id="fermer" style="display:none">
<div class="test">
 
<div class="test1">
 
<div class="test2">
 
<a  title="fermer"  href="javascript:visibilite('fermer');"><img src="../images/cancel.png" alt="Fermer" width="32" height="32"/></a>
 
</div>
 
<object > </object>
 
</div>
 
</div>
 
</div>
 
</div>

EDIT 2 ça marche sous IE et Chrome pas sous ff et opera

**NoSmoking** · 29/11/2011, 19h11

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

fermer.style.display = 'inline';

il sort d'où le fermer, il est IMPORTANT de respecter les conventions qui veulent que pour récupérer la référence à un objet on utilise la méthode getElementById.

J'espére d'autre part que ce que tu nous présentes est un extrait et non pas ton code, car coté structure

**stanux24** · 29/11/2011, 19h44

alors le fermer c’était pour la div id="fermer" mais visiblement j'oublie un truc dans le javascript.

pour mon code ben tout le javascript c'est ce que je compte utiliser et pour ce qui est des div il n'y a pas tout le code.

mais ce qui est marrant cest que ça marche pour ie et chrome

Je sais que j'ai pas mal de taf à faire pour me former a javascript, mais là je suis un peut dans la version pressé, je cherche cependant a comprendre en parallele pour progresser plus vite par la suite, c'est pour ça que je fait appel à vos service car je sais que vous maîtrisé bien plus que moi

[EDIT] bon j'ai rajouté une ligne de code ça semble fonctionner si vous avez des suggestion pour améliorer la structure de mon js ça sera avec plaisir

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
<script type="text/javascript" language="JavaScript"> 
  function setCookie(nom, valeur, expire, chemin, domaine, securite){ 
     document.cookie = nom + ' = ' + escape(valeur) + '  ' + 
               ((expire == undefined) ? '' : ('; expires = ' + expire.toGMTString())) + 
               ((chemin == undefined) ? '' : ('; path = ' + chemin)) + 
               ((domaine == undefined) ? '' : ('; domain = ' + domaine)) + 
               ((securite == true) ? '; secure' : ''); 
   } 
 
   function  getCookie(name){ 
     if(document.cookie.length == 0) 
       return null;
 
     var regSepCookie = new RegExp('(; )', 'g'); 
     var cookies = document.cookie.split('; '); 
 
     for(var i = 0; i < cookies.length; i++){ 
       var regInfo = new RegExp('=', 'g'); 
       var infos = cookies[i].split(regInfo); 
       if(infos[0] == name){ 
         return unescape(infos[1]); 
       } 
     } 
     return null; 
   } 
   </script>
 
   <script type="text/javascript"> 
window.onload=function() 
{ 
    var coucou = document.getElementById('coucou');
	var fermer = document.getElementById('fermer'); 
if( getCookie('coucou')){
  coucou.style.display = 'none';
}
else
 
 
{
fermer.style.display = 'inline';	
  var dtExpire = new Date();
  dtExpire.setTime(dtExpire.getTime() + 3600 * 1000);
  setCookie('coucou', 'hey hey', dtExpire, '/' );
} 
  }  
</script> 
 
 
<script language="JavaScript" type="text/javascript" src="../js/div.js"></script>
 
<div ID="coucou">
<div id="fermer" style="display:none">
<div class="test">
 
<div class="test1">
 
<div class="test2">
 
<a  title="fermer"  href="javascript:visibilite('fermer');"><img src="../images/cancel.png" alt="Fermer" width="32" height="32"/></a>
 
</div>
 
<object > </object>
 
</div>
 
</div>
 
</div>
 
</div>

**NoSmoking** · 29/11/2011, 22h27

Je sais que j'ai pas mal de taf à faire pour me former a javascript,...

entre autres structure d'une page

ce que l'on aurait aimé voir

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
<!DOCTYPE HTML>
<html lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>[...]</title>
<style type="text/css">
</style>
<script type="text/javascript" src="../js/div.js"></script>
<script type="text/javascript">
function setCookie(nom, valeur, expire, chemin, domaine, securite) {
  document.cookie = nom + ' = ' + escape(valeur) + '  ' + ((expire == undefined) ? '' : ('; expires = ' + expire.toGMTString())) + ((chemin == undefined) ? '' : ('; path = ' + chemin)) + ((domaine == undefined) ? '' : ('; domain = ' + domaine)) + ((securite == true) ? '; secure' : '');
}
function getCookie(name) {
  if (document.cookie.length == 0) return null;
  var regSepCookie = new RegExp('(; )', 'g');
  var cookies = document.cookie.split('; ');
  for (var i = 0; i < cookies.length; i++) {
    var regInfo = new RegExp('=', 'g');
    var infos = cookies[i].split(regInfo);
    if (infos[0] == name) {
      return unescape(infos[1]);
    }
  }
  return null;
}
window.onload = function () {
  var coucou = document.getElementById('coucou');
  var fermer = document.getElementById('fermer');
  if (getCookie('coucou')) {
    coucou.style.display = 'none';
  }
  else {
    fermer.style.display = 'inline';
    var dtExpire = new Date();
    dtExpire.setTime(dtExpire.getTime() + 3600 * 1000);
    setCookie('coucou', 'hey hey', dtExpire, '/');
  }
}</script>
</head>
<body>
<div ID="coucou">
  <div id="fermer" style="display:none">
    <div class="test">
      <div class="test1">
        <div class="test2">
          <a title="fermer" href="javascript:visibilite('fermer');"><img src="../images/cancel.png" alt="Fermer" width="32" height="32"></a>
        </div>
        <object> </object>
      </div>
    </div>
  </div>
</div>
</body>
</html>

- bien penser à l'indentation autant javascript que HTML.
- maintenant tu peux mettre ton javascript dans le fichier externe

**stanux24** · 29/11/2011, 23h29

D'accord je comprend mieux effectivement si je devais placer ce code dans ma page il aurait un peut plus ressemblé a ce que tu ma donnés. J'ai mal interprété ce que tu as dit.

En tous cas je vous remercie vraiment, j'ai pu grâce à votres aides NoSmoking et Bovino, réaliser le code que je souhaitais. bonne continuation et au plaisir de se croiser sur ce forum.

Afficher une div une fois par jour

JavaScript

Discussions similaires

Partager

Partager