Afficher une div une fois par jour

Version imprimable

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:

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

29/11/2011, 13h09
NoSmoking
Bonjour,
sans regarder plus avant, j'aurais plutôt fait un
Code:

1 2 3 if( getCookie('coucou')){ coucou.style.display = 'none'; }
29/11/2011, 13h28
stanux24

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.

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:

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:

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...

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

je remet le code utiliser actuellement:

Code:

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>

29/11/2011, 14h53
NoSmoking

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

Code:

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

et non

Code:

var infos = cookies.split(regInfo);

:faq: http://javascript.developpez.com/faq...=navig#cookies
29/11/2011, 15h02
stanux24

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

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
29/11/2011, 15h13
Bovino
Code:

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

Code:

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

te semble trop simple ? :calim2:

Citation:

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.

ah ok je comprend mieux bon j'ai trouvé :ccool:

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:

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

Code:

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

Il faut que je remplace

Code:

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

par

Code:

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

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

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:

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

29/11/2011, 19h11
NoSmoking

Citation:

Code:

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 :cry:

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 :oops:

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 :oops:

[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:

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>

Citation:

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:

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

29/11/2011, 23h29
stanux24

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. :ccool: